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記 
动态 网 站 的 服务 器 技术 有 很 多 种 ，ASP 是 应 用 最 广泛 的 一 种 。 动 态 网 站 开发 的 工具 也 有 
Dreamweaver CS5 工具 结合 


プ ベ ーH ロロ 


起 来 建立 动态 网 站 能 够 达到 事半功倍 的 效果 。 


很 多 种 ， 而 Dreamweaver CS5 是 最 受 欢 迎 、 易 用 性 最 高 的 一 种 。 把 ASP 技术 和 
本 书 从 基本 的 网 站 建设 入 门 知 识 开 始 讲解 ， 循 序 渐进 地 发 展 到 专业 网 站 建设 经 验 ， 紧 扣 
商业 应 用 实例 ， 引 导读 者 一 步 步 成 为 动态 网 站 建设 的 高 手 。 全 书 的 内 容 与 结构 如 下 : 

第 1 革 从 动态 网 站 建设 的 前 期 准备 工作 入 手 ， 通 过 资深 设计 师 的 经 验 诠 释 ， 帮 助 读者 党 
所 动态 网 站 建设 的 核心 设计 思路 。 
搭建 方法 。 


与 建设 。 


第 2 半 讲 解 现在 通用 的 Web 2.0 标准 静态 网 页 的 搭建 方法 ， 让 该 者 快速 学 握 静 态 页 面 的 


第 3 一 9 章 ， 每 草 介 绍 一 种 动态 网 站 建设 的 核心 技术 。 分 别 介 绍 了 用 户 管 理 系统 、 留 言 
板 系统 、 新 闻 系 统 、 投 票 系统 、 论 坛 系统 、 博 客 系统 以 及 网 络 购物 系统 7 个 大 型 系统 的 开 友 
其 目的 是 使 读者 在 学 完 本 书后 ， 能 够 通过 Dreamweaver CSS 建立 Web 应 用 程序 ， 
并 在 此 基础 上 构建 带 有 Access 数据 库 的 大 型 网 站 。 

第 10 草 重 点 介绍 搜索 引擎 优化 的 知识 ， 包 括 SEO 基础 知识 

的 企业 网 站 SEO 方案 以 及 选择 企业 关键 字 的 重要 性 等 内 容 ， 帮 助 谈 者 掌握 搜索 引擎 网 站 优 
化 的 技术 。 

人 


与 其 他 相关 似 的 计算 机 图 书 相 比 ， 本 书 上 其 有 以 下 儿 点 特色 : 
识 入 手 


搜索 引擎 基础 、 设 计 正 确 
， 傈 要 
网 页 排版 制作 等 内 容 。 


当 本 书 以 学 习 Web 设计 和 网 站 建设 为 目的 ， 从 网 页 制作 技术 和 网 页 制作 工具 的 基础 知 


地 介绍 了 当今 流行 的 Web 制作 工具 和 技术 ， 包 括 网 站 开发 技术 、 图 像 处 理 和 
ei 
以 独立 制作 网 站 的 目的 。 


让 附 送 光 意 中 噌 送 本 毛 実 例 的 多 媒 体 教 学 光 昔 
材 ， 是 学 习 动 态 网 站 建设 的 最 佳 素 材 宝 典 。 


并 本 书 定位 在 基础 与 提 局 上 ， 在 深入 浅 出 、 通 俗 易 情 的 基础 上 ， 强 调 介绍 知识 的 系统 
性 和 制作 技巧 的 实用 性 。 不 仅 使 读者 能 顺利 入 门 ， 还 可 以 使 读者 有 一 定 程 度 的 提高 ， 达 到 可 


排 合理 ， 注 重 实用 性 与 可 操作 性 。 


本 书 由 具有 10 年 网 站 建设 实战 经 验 的 资深 设计 师 编 写 ， 理 论 与 实践 相 结 合 ， 革 六 
生 
季 
王 新 权 、 


同时 附 赠 所 用 网 站 实例 源 代 码 及 素 
于 倚 云 等 编号 。 
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动态 网 站 开发 是 网 站 建设 的 一 项 核心 工作 。 动 态 网 站 开发 简单 地 说 束 是 实现 动态 的 提取 和 更 
新 网 站 数据 的 操作 ， 采 用 动态 提取 、 存 储 网 站 数据 的 网 站 开发 技术 一 般 统称 为 动态 网 站 开发 技 
术 。 目 前 较为 普及 的 动态 网 站 开发 语言 有 ASP、ASPNET、PHP、JSP 等 , ASP 是 一 种 应 用 非常 
三 泛 的 动态 网 页 开发 技术 。 本 书 就 是 围绕 如 何 利 用 Dreamweaver CS5+ASP 平台 进行 网 站 开发 展开 
的 。 本 章 将 介绍 关于 动态 网 站 开发 建设 的 基础 知识 。 
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动态 网 站 基础 知识 


网 页 制作 撤 术 的 发 展 日 新 月 异 ， 对 从 事 网 站 开发 与 建设 的 设计 师 来 说 这 是 竺 运 的 ， 
为 能 够 在 网 络 上 更 好 地 设计 目 己 的 作品 ， 但 同时 又 是 羊 吉 的 ， 因 为 需要 不 断 地 学 习 和 笃 握 
狐 技 术 。 


静态 与 动态 网 站 的 区 别 


网 站 的 开发 是 一 项 系统 性 的 工作 ， 首 先 要 经 过 平面 设计 师 使 用 平面 设计 软件 如 
Photoshop 制作 出 页 和 面 的 锥 形 ， 再 由 网 页 设计 师 使 用 网 页 设计 软件 如 Dreamweaver 软件 进行 
静态 页 面 的 排版 ， 最 后 由 网 页 程序 员 使 用 不 同 的 编程 方法 完成 各 功能 模块 的 开 有 发。 大体 上 制 
作 一 个 动态 网 站 需要 制作 项 态 的 网 页 和 开发 动态 的 网 页 两 个 关键 环节 。 下 面 首 先 来 介绍 一 下 
“静态 ”和 “动态 ”网 页 的 基本 概念 。 

上 所谓“ 静态” 指 的 驶 是 网 站 的 网 页 内 容 “ 固 定 不 变 ”， 当 用 户 浏览 右 通 过 互联 网 的 
HTTP (Hypertext Transport Protocol) 协议 问 Web 服务 器 请 求 提供 网 页 内 容 时 ， 服 务 右 仪 仪 
是 将 已 经 设计 好 的 静态 HIML 文 梢 传送 到 用 户 浏 览 器 。 其 页 面 内 容 使 用 的 是 标准 的 HTML 
代码， 最 多 再 加 上 一 些 GIF 格式 的 効 画 関 片 。 

“动态 ”网 页 最 主要 的 作用 在 于 可 以 让 用 户 通过 浏览 堪 访 问 、 管 理 和 利用 存储 在 服务 需 
上 的 资源 和 数据 ， 特 别 是 数据 库 中 的 数据 。 因 此 ， 利 用 “项 态 ” 页 面具 能 构建 单纯 的 供 显 示 
预 设 信息 的 网 页 ， 而 利用 “动态 ”网 页 则 可 以 构建 复杂 的 、 可 以 用 来 进行 数据 操作 的 、 基 于 
浏览 如 的 Web 应 用 程序 。“ 动 态 ” 网 页 不 仅 能 够 癌 用 户 显 示人 他们 所 需要 的 信息 ， 而 且 可 以 让 
用 户 根 据 需 要 对 这 些 信息 进行 处 理 。 


| 动态 网 站 开发 技术 


目前 , 最 常用 的 4 种 动态 网 页 开发 语言 有 ASP (Active Server Page)、ASPNET (Active 
Server Page .NET)、JSP (Java Server Page) 和 PHP (Hypertext Preprocessor)。 那 么 这 4 种 程 
序 各 有 什么 优 缺 后 ， 我 们 学 习 哪 一 种 语言 更 容易 上 和 手 呢 ?下 面 束 让 我 们 一 起 来 了 解 一 下 这 4 
种 技术 的 特点 。 

国 ASP 的 特点 

ASP 使 用 VBScript、JavaScript 等 简单 易 懂 的 脚本 语言 ， 结 合 HTML 代 人 码 ， 即 可 快速 地 
完成 网 站 的 应 用 程序 。ASP 程 序 无 须 compile 编 译 ， 可 在 服务 器 端 直接 执行 ， 使 用 普通 的 文 
本 编辑 费 ， 如 使 用 Windows 的 记事 本 ， 即 可 进行 编辑 设计 。ASP 程 友 与 浏览 右 无 天 ， 客 刻 
端 只 要 使 用 可 执行 HTML 码 的 浏览 器 ， 即 可 浏览 用 ASP 语 言 所 设计 的 网 页 内 容 。ASP 所 使 
用 的 脚本 语言 均 在 Web 服务 器 痛 执 行 ， 客 户 病 的 浏览 右 不 需要 执行 这 些 脚 本 语言 。ASP 能 
与 任何 ActiveX 脚 本 编程 语言 兼容 。 除 了 可 使 用 VBScript 或 Java Script 语言 设计 外 ， 还 可 以 
通过 plug-in 的 方式 ， 使 用 由 第 三 方 提供 的 其 他 脚本 语言 ， 如 REXX 语 言 、Perl 语 言 和 Tcl 语 
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言 等 。 脚 本 引擎 是 处 理 脚本 程序 的 COM (Component Object Model) 对 象 ， 可 使 用 服务 器 端 
成 客户 端的 脚本 。 

画 ASPNET 的 特点 

ASPNET 彻 展 抛弃 了 脚本 语言 ， 用 C# 或 VB 编写 ， 为 开发 者 提供 了 更 加 强 有 力 的 编程 > 
资源 ， 人 允许 用 服务 器 控件 取代 传统 的 HTML 元 素 ， 而 且 代码 与 界面 分 开 。 

ASPNET 不 是 ASP 的 简单 升级 ， 而 是 Microsoft 推出 的 一 种 新 的 计算 平台 ， 它 简化 了 在 
高度 分 布 式 Internet 环境 中 的 应 用 程序 开发 。 其 全 狐 的 技术 架构 会 让 每 个 用 户 的 编程 变 得 更 
加 简单 。 

国 PHP 的 特点 

PHP 是 一 种 跨 平 台 的 服务 右 新 散 入 式 脚 本 语言 。 它 大 量 地 借用 C、Java 和 Perl 语言 的 语 
法 ， 并 结合 PHP 目 己 的 特性 ， 使 Web 开发 者 能 够 快速 地 写 出 动态 页 面 。 它 文 持 目前 绝 大 多 
数 数据 库 。 另 外 ，PHP 是 完全 免费 的 ， 可 以 从 PHP 官方 站 点 目 由 下 载 得 到 ， 而 且 用 户 可 以 
不 受 限 制 地 获得 源 代码。 

PHP 可 以 编 诺 成 具有 与 许多 数据 库 相 连接 的 函 数 ， 用 户 还 可 以 目 己 编写 外 围 的 函数 从 
而 间接 存 取 数据 库 。 通 过 这 样 的 途径 在 更 换 使 用 的 数据 库 时 ， 可 以 轻松 地 修改 编码 以 适应 
这 样 的 变化 。 但 PHP 提供 的 数据 库 接口 文 持 不 统一 ， 如 对 Oracle、MySQL 和 Sybase 的 接 
口 ， 彼 此 都 不 一 样 ， 这 也 是 PHP 的 一 个 需要 完善 的 地 方 。 

国 JSP 的 特点 

JSP 是 Sun 公司 推出 的 网 站 开发 语言 。JSP 可 以 在 Serverlet 和 JavaBean 的 文 持 下 ， 完 成 
功能 强大 的 站 点 程序 。 

使用 JSP 技术 ， 开 发 人 员 可 以 使 用 HTML 或 者 XML 标识 来 设计 和 格式 化 最 终 页 面 ， 使 
用 JSP 标识 或 者 小 脚本 来 产生 页 面 上 的 动态 内 容 。 产 生 内 容 的 迪 辑 被 封装 在 标识 和 
JavaBeans 和 群 组 件 中 ， 并 且 捆 绑 在 小 脚本 中 ， 所 有 的 脚本 在 服务 器 病 执 行 。 如 果 核 心 人 逻辑 被 
封 儿 在 标识 和 Beans 中 ， 那 么 其 他 人 ， 如 Web 管理 人 员 和 页 面 设 计 者 ， 能 够 编辑 和 使 用 JSP 
页 面 ， 而 不 影响 内 容 的 产生 。 在 服务 右 疡 ，JSP 引擎 解释 JSP 标识 ， 产 生 所 请 求 的 内 容 〈 例 
如 ， 通 过 存 取 JavaBeans 和 群 组 件 ， 使 用 JDBC 技术 存 取 数 据 库 )， 并 且 将 结果 以 HIML (或 者 
XML) 页 面 的 形式 发 送 回 浏览 占 。 这 既 有 助 于 作者 你 护 目 己 的 代码 ， 而 叉 保 证 页 面 在 任何 基 
于 HTML 的 Web 浏览 器 完全 可 用 。 

目前 在 国内 ASP 与 PHP 应 用 最 为 广泛 。 而 JSP 虽然 在 国内 采用 的 较 少 ， 但 在 国外 已 经 
是 比较 流行 的 一 种 技术 ， 尤 其 是 电子 商务 关 的 网 站 ， 多 采用 JSP。 

ASP、ASPNET、PHP 和 JSP 四 者 都 有 相当 数量 的 用 户 。 正 在 学 习 或 使 用 动态 页 面 
的 朋友 可 根据 四 者 的 特点 选择 一 种 适合 上 自己 的 语言 。 本 书 是 为 初 、 中 级 网 站 建设 者 学 习 
建设 动态 网 站 而 编写 的 ， 我 们 推荐 谈 者 选择 ASP 技术 学 习 。 
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ASP 网 站 的 工作 方式 和 流程 


进行 ASP 网 页 开发 之 前 ， 首 先 必 须 配置 运行 ASP 网 页 所 需 的 软件 环境 ， 只 有 配置 了 运 
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行 环 境 后 ASP 网 站 才能 正常 运行 。 本 节 将 重点 介绍 ASP 网 站 的 工作 方式 和 流程 。 
动态 网 页 的 工作 方式 


一 个 ASP 动态 网 站 通 销 包括 静态 页 面 和 动态 页 面 。 动 态 页面 与 静态 页 面 之 间 的 区 
别 是 运行 脚本 的 位 置 不 同 ， 动 态 页 和 面 需要 通过 调用 数据 库 在 服务 占 上 运行 ， 而 静态 页 表 
的 脚本 不 能 在 服务 器 上 运行 。 其 他 方面 两 者 比较 类 似 ， 例 如 这 两 种 页 面 都 可 以 使 用 
VBScript 或 JavaScript 脚本 语言 ， 且 都 存放 在 服务 器 上 ， 运 行 的 时 候 都 提交 给 Web 浏览 
Yo 

在 服务 器 上 运行 的 程序 称 为 脚本 或 服务 器 问 的 脚本 ， 可 以 使 用 数据 库 等 多 种 网 络 资源 。 
在 Dreamweaver CSS 中 ， 服 务 器 端的 脚本 称 为 服务 行为 。 一 个 Web 页 面 在 提交 给 浏览 器 之 
表 ， 服 务 咒 问 的 脚本 可 以 上 肥 指 令 给 服务 器 ， 服 务 器 根据 指令 的 具体 内 容 从 数据 库 中 提取 合适 
的 数据 ， 并 把 这 些 数据 插入 到 动态 页 面 中 ， 插 入 完成 后 再 提交 给 浏览 器 。 

在 网 页 中 可 以 包含 各 种 程序 ， 有 些 程 序 在 用 户 的 浏览 器 中 运行 ， 而 有 些 程序 则 在 Web 
服务 右上 运行 。 包 含 了 Web 服务 器 上 运行 脚本 程序 的 网 页 则 被 称 为 “交互 式 网 页 ”。 

交互 式 网 页 的 最 大 应 用 在 于 Web 数据 库 系 统 。 当 脚本 程序 访问 Web 服务 器 闹 的 数据 库 
时 ， 将 得 到 的 数据 转变 为 HTML 代码 ， 并 友 送 给 客户 器 的 浏览 右 ， 客 户 站 的 浏览 右 瓯 显示 
出 数据 库 中 的 数据 。 当 用 户 需 要 将 数据 写 入 数据 库 时 ， 可 填写 在 网 页 的 表单 中 ， 友 壕 给 浏览 
器 ， 然 后 由 脚本 程序 将 其 写 入 到 数据 库 中 。Web 数据 库 系 统 的 工作 过 程 如 图 1-1 所 示 。 Web 
数据 库 系统 是 Web 与 传统 数据 库 系 统 的 完美 结合 ， 与 传统 Web 系统 相 比 ， 它 的 信息 来 目 数 
据 库 ， 页 面 信息 会 随 数据 库 的 更 新 而 更 新 。 


数据 库 服 务 履 


图 1-1 Web 数据 库 系统 的 工作 过 程 示意 


| ASP 动 态 网 页 的 工作 流程 


建设 一 个 ASP 动态 网 站 之 前 ， 需 要 进行 策划 和 准备 工作 。 策 划 工 作 主 要 指 事先 要 设计 
好 网 站 的 结构 ， 而 准备 工作 主要 指 事先 要 准备 好 网 站 的 域名 、 衬 间 并 设计 好 网 站 的 VI〔 网 
页 视 沉 效果 设计 )。 然 后 丈 古 网 站 的 设计 实现 ， 最 后 古 网 站 的 维护 与 推广 工作 。 其 中 网 站 设 
计 实 现 的 工作 流程 如 下 : 
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国 安装 Web 服务 器 程序 

本 书 以 IIS 作为 Web 服务 器 程序 。 一 旦 安装 了 Web 服务 器 程序 ， 束 相当 于 将 计算 机 设 
置 成 为 一 台 真 正 的 Internet 服务 器 ， 所 以 只 需 局 动 浏览 器 ， 并 在 地 址 栏 中 输入 映射 站 点 的 地 
址 ， 就 可 以 进行 系统 、 细 致 的 测试 ， 一 切 就 像 访 问 真正 的 站 点 一 样 。 在 利用 浏览 器 测试 之 他) 
余 ， 可 能 还 需要 对 代码 进行 编辑 。 

加 建立 静态 网 页 

动态 网 页 是 一 种 交互 式 网 页 ， 所 有 的 交互 式 网 页 ， 都 来 自 于 静态 网 页 。 因 此 在 建立 数据 
库 网 页 时 需要 建立 一 个 静态 网 页 。 这 个 静态 网 页 要 与 其 他 的 网 页 一 样 ， 包 含 静 态 文字 、 图 
片 、 动 画 、 超 级 链接 、 按 钮 以 及 表单 等 。 

回 建立 数据 库 

实质 上 ， 动 态 网 页 就 是 一 个 可 以 访问 数据 库 的 网 页 。 在 建立 数据 库 网 页 前 ， 要 建立 一 个 
数据 库 。 在 建立 数据 库 时 ， 还 要 根据 项 目的 具体 要 求 设计 数据 库 的 结构 。 本 书 采 用 的 是 入 门 
级 的 Access 数据 库 。 

加 加 入 动态 网 页 技术 

动态 网 页 是 通过 在 静态 网 页 中 加 入 ASP 代码 或 使 用 其 他 动态 网 页 技术 访问 数据 库 ， 将 
数据 库 中 的 数据 显示 在 网 页 中 或 将 网 页 中 的 数据 记录 到 数据 库 中 。 最 后 还 需要 调试 应 用 程 
序 。 对 于 Web 应 用 程序 来 说 ， 所 谓 运 行 ， 就 是 利用 浏览 器 打开 它 ， 对 于 传统 的 静态 页 面 文 
件 ， 也 即 带 有 .html 文件 扩展 名 的 文件 来 说 ， 直 接 用 浏览 器 打开 它 就 可 以 完成 测试 ， 但 是 对 
于 动态 页 面 ， 即 带 有 .asp 等 文件 扩展 名 的 页 面 文件 来 说 ， 必 须 将 它们 放 入 真正 的 Web 站 点 ， 
才能 进行 测试 ， 直 接 用 浏览 器 打开 它 是 不 行 的 。 

在 Dreamweaver CSS 中 建立 数据 库 网 页 的 过 程 大 致 相同 ， 有 基体 步骤 如 下 : 

分 析 动 态 网 站 的 要 求 ， 建 立 合适 的 数据 库 。 

定义 网 站 站 点 。 

创建 静态 网 页 。 

创建 数据 源 。 

创建 数据 链接 。 

创建 数据 集 。 

在 网 页 中 添加 服务 器 端 行为 。 

调试 数据 库 网 页 并 发 布 使 用 。 


看 建立 本 地 服务 器 


Dreamweaver CSS 无 法 独立 创建 动态 网 页 ， 必 须 建 立 一 个 Web 服务 器 环境 和 数据 奋 运行 环 
境 。 Dreamweaver CSS 支持 ASP、JSP、Cold Fusion 和 PHP 4 种 服务 器 技术 ， 在 使 用 Dreamweaver 
CSS 之 前 逢 要 选 定 一 种 技术 。 本 书 选 用 的 是 最 第 用 的 ASP 服务 需 技 术 ， 即 使 用 ASP 编写 脚本 话 
句 。 选 择 ASP 服务 器 技术 ， 则 必须 安装 文 持 ASP 的 网 站 服务 器 ITS 。 
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进行 ASP 网 页 开发 之 前 ， 首 先 必 须 安装 编译 ASP 网 页 所 需要 的 软件 环境 。IIS 是 由 微 
软 公 司 开 发 、 以 Windows 操作 系统 为 平台 、 运 行 ASP 网 页 的 网 站 服务 器 软件 。IIS 内 建 有 
ASP 的 编译 引擎 ， 在 设计 网 站 的 计算 机 上 必须 安 北 IS 才能 测试 ASP 网 页 ， 在 Dreamweaver 
CS5 中 创建 ASP 文件 前 ， 同 样 必须 安装 IIS 并 创建 虚拟 网 站 。IIS 本 身 提供 各 衝 Internet 服 
务 ， 例 如 可 供 文 件 传输 的 FTP 协议 、 发 送 电 子 邮件 的 SMTP 协议 及 网 页 浏览 的 网 站 服务 
等 ， 这 些 服务 在 “Internet 信息 服务 ”窗口 中 以 目录 的 方式 分 类 。 当 用 户 利用 IIS 创建 网 
站 时 ， 所 有 的 网 页 都 必须 放 在 “网 站 ”这 个 特定 的 目录 中 。IIS 根据 指定 的 网 址 对 应 路 
径 ， 将 其 中 的 文件 或 子 目 录 对 应 到 计算 机 中 存储 网 页 文件 的 真正 位 置 。 当 用 户 通过 浏览 
器 浏览 网 页 时 ，IIS 根据 其 指定 的 网 址 取出 对 应 的 文件 ， 解 析 后 再 通过 Internet 传送 至 用 
户 计算 机 的 浏览 器 上 。 


对 于 操作 系统 Windows Server 2003 或 者 Windows XP Professional 而 言 ， 系 统 已 经 默 
认 安 装 了 IIS。 下 面 以 Windows XP Professional 为 例 ， 介 绍 如 何 安 装 IIS 服务 器 ， 其 具体 
步骤 如 下 : 

将 Windows XP Professional 系统 安装 光盘 搬入 光盘 张 动 器 中 。 

选择 “开始 ”有 末 蛙 中 的 “设置 ”一 “控制 面板 ”命令 ， 打 开 “ 探 制 面板 ”， 在 “ 控 
制 面 板 ” 中 双击 “ 瀛 加 或 删除 程序 ”， 打 开 “ 添 加 或 删除 程序 ”对 话 框 ， 如 图 1-2 所 示 。 


巧 添 加 或 删除 程序 


当前 实 装 的 程序 : 口 、 显 示 更 新 0) 排序 方式 GS): | 名 称 


篇 kdobe Creative Suite 3 Design Premium {zh CH} 大 小 159 00W 上 
单 击 此 处 获得 志 持 信息 。 已 使 用 很 少 
上 次 使 用 日 期 2008-2-20 
要 更 中 此 程序 或 将 它 从 计算 机 册 除 ， 单 击 “更 改 ; 册 | 除 ”。 
Dw Adobe Dreamweaver CS3 忧 化 版 大小 274. ロ nME 
六 Adobe Dreamweaver CS4 大小 ”274. 00MB 
hdobe Dreamweaver CS4 大 小 ”15. 55MB 
EE Adobe Flash CS3 Professional 大 小 。 44.28MBE 
9 hdobe Flash Flayer 9 ActiveX 大 小 2.BEME 


@ Adobe Flash Flayer 9 Flugin 太 小 2.53ME 


時 hAdobe Flash Flayer ActiveX 

Ea Adobe Fhotoshop CS3 

pa hAdobe Reader 8.1.0 - Chinese Simplified 大 小 193.00WB 

如 ApplLe Software Update 大 小 2 41ME 

六 ATI Display Driver 

= Cool Edit Fro 2.1 太 小 25.13ME 
©) Cors1DRAW Graphics Suite X3 ーー 大 小 _4n3_nnMR 半 


图 1-2 “添加 或 删除 程序 ”对 话 框 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


从 左 侧 列表 中 选择 “添加 /删除 Windows 组 件 ”按钮 总 ， 打 开 如 图 1-3 所 示 的 
对 话 框 。 
单 击 选 中 “Internet 信息 服务 〈IHS)” 复 选 枉 ， 然 后 单 击 “ 详 细 信 息 ” 鬼 
钮 ， 打 开 如 图 1-4 所 示 的 对 话 框 ， 从 中 选中 需要 安装 的 Windows 组 件 的 复 选 框 ， 建 议 他) 
选中 所 有 的 组 件 。 单 击 “ 确 定 ” 按 钮 后 ， 返 回 图 1-3 所 示 对 话 框 。 WA 
单 击 “ 下 一 步 ”按钮 ， 如 果 安 装 需要 从 Windows 光盘 复制 文件 ， 将 打开 如 ”二 
1-5 所 示 的 “Windows ”组 件 同 村” 和 安 状 进 度 对 话 框 。 


Windows 组 忻 向 导 Internet 信息 服务 (IIS) 


Tindors IN 了 e 月 本 ER Es 
加除 Windows XP 的 组 件 。 可 六 加 结 由 隆基 由 Es 灰色 框 表示 只 会 安装 该 组件 的 
Tntsrnet 信息 服务 (TIS) 的 子 姐 件 人 C): 

cv FrontPage 2000 服务 器 扩展 

人 Internet 信息 服务 管理 单元 1.3 ME 
SMTF Service 3.B ME 
公用 文件 1.0 ME 
器 Trternet Explorer 哆 万 维 网 服务 2.3 ME 
四 *g Internet 恒 息 服务 (IIS) | 地 文档 本 3.5 ME Z| 
四 WO NSH Explorer 11.8 ME i | 
四 調 0at1ook Fxxpress nn MB | 描述 : 使用 Microsoft FrontPags 和 Visual Interley 来 创作 和 管理 站 点 


要 添加 或 册 除 某 个 组 件 ， 请 单 击 旁边 的 复 选 租 。 克 包 答 表 示 和 会 安装 该 组 件 的 
一 部 分 。 归 查看 组 件 内 容 ,请 单 击 “ 详 细 信 息 ” 


组 件 CC): 


| 四 国 网 网 网 


描述 : 包括 Web 和 FTP 支持 ， 以 及 对 FrontPage、 事 劳 处 理 、Active 
Server Fages 和 数据 库 连 接 的 支持 。 


所 需 磁 盘 空间 : 57.6 MB っ 
可 用 磁盘 空间 : 4141.1 ME or 4 りー 所 需 磁 盘 空 间 : 57.6 ME 


可 用 磁盘 空间 : 4140.5 ME 


图 1-3 “添加 /删除 Windows 组 件 ” 对 话 框 图 1-4 “Internet 信息 服务 (IIS) ”对 话 框 


安装 完成 后 ， 将 打开 “Windows 组 件 向 导 ” 安 装 完成 对 话 框 ， 如 图 1-6 所 
示 ， 单 击 “ 完 成 ”按钮 ， 则 完成 设置 。 


Windows 组 件 癌 导 


正在 配置 组 件 
实 装 程序 正在 根据 您 的 请 求 ， 进 行 配置 更 改 。 


Wandows 组 御 癌 导 
完成 “Windows 组 件 向 导 ” 


店 選 成功 地 玩 万 了 Windowxs 姐 件 向 导 。 


动 请 稍 候 ， 安 装 程序 正在 配置 蛤 件 。 所 花 时 间 取 决 于 选 定 的 组件。 


状态 : ”正在 完成 附件 和 工具 的 配置 .. . 


[aaa | 


清单 击 “ 充 成 ”来 关闭 此 向 导 ， 


图 1-5 ”安装 进度 对 话 框 图 1-6 安装 完成 对 话 框 


默认 状态 下 ，IIS 将 被 安装 到 C 驱动 左下 的 Inetpub 目录 中 ， 其 典型 安装 时 的 目录 结构 如 
图 1-7 所 示 。 其 中 有 一个 名 为 “wwwroot” 的 文件 夹 ， 它 是 浏览 访问 的 默认 目录 ， 访 问 的 默 
认 Web 站 点 也 放置 在 这 个 文件 夹 中 。 


BM Inetpub 
: 立件) 编辑 人 于) 查看 名 ”收藏 愉 ) 工具 他) 大助 出) 


Ou ©-S の | 居 人 国 :- 


: 地 址 凹 ) Bc:\Inetpub 


田 吉 3.5 软盘 以 :) 

日 swe 本 地 磁盘 (C:) 
由 | 当 CCProxy = 
BD Documents and Set 


图 1-7 IIS 安装 的 文件 夹 


Te 配置 网 站 服务 器 


要 完成 本 机 站 点 的 创建 ， 并 提供 对 Web 应 用 程序 技术 的 文 持 ， 不 仅 要 有 Web 服务 右 环 
境 ， 而 且 要 有 应 用 程序 服务 器 环境 ， 前 者 提供 对 Web 浏览 的 文 持 ， 而 后 者 提供 对 ASP 等 应 
用 程 序 的 支持 。 IIS 将 Web 服务 器 和 应 用 程序 服务 器 的 功能 合 二 为 一 ， 所 以 不 用 再 安装 其 他 
的 应 用 程序 服务 噩 系统 ， 直 接 利用 IS， 束 可 以 实现 本 机 站 点 的 创建 。 

国 打开 IIS 

首先 启动 HS。 在 不 同 的 操作 系统 下 ， 局 动 IIS 的 方法 也 不 同 ， 下 面 是 在 Windows XP 
Professional 系统 中 启动 IIS 的 方 法 : 

选择 “开始 ”有 末 单 中 的 “设置 ”一 “控制 面板 ”命令 ， 打 开 “ 控 制 面板 ” 
窗口 。 

在 “控制 面板 ”中 双击 “管理 工具 ”图 标 师 ， 打 开 “ 管 理工 具 ” 对 话 框 ， 如 
图 1-8 所 示 。 


| 文件 中 ”编辑 EE) 查看 0 收藏 让 工具 で) 帮助 
Ou © 落 の 昧 区 We | 国 - 
; 地 世 Q) | 管理 工具 マ | 回 ES 回 ・ の 約 折 信吉 


es < 
映 控 方 式 


本 地 安全 策略 
快 捷 方 式 


计算 机 管理 
げ 控制 面板 方式 


| 我 的 文档 

回 共享 文档 

3 我 的 电脑 斌 引 数据 源 (ODEC) 
ァ ピ 


加 RE 方式 


7 


管理 工具 
系统 立 件 来 


1-8 “管理 工具 ”对 话 框 


第 1 草 


动态 网 站 开发 基础 


在 “管理 工具 ”对 话 框 中 双击 “Internet 信息 服务 ”图 标 靶 ， 将 启动 IIS， 


如 图 1-9 所 示 。 


\ Intermet 信息 服务 


文件 ) ”操作 必 ) 査 者 ) ”帮助 00) 


Se 画 | 岛 旦 
本: Tnternet 信息 服务 


中- 筷 地 -01 (林地 计算 机 ) 


1-9 


国 设置 默认 的 网 站 站 点 


* 画 I 


回 回 上 


“Tnternet 信息 服务 ”对 话 框 


默认 站 点 就 是 在 浏览 器 的 地 址 栏 中 输入 http://localhost 或 htp://127.0.0.1 所 显示 的 站 点 。 


该 站 点 中 的 所 有 文件 实际 上 位 于 CNImnetpub\wwwroot 文件 夹 中 ， 其 默认 主 


名 称 是 Default.asp。 


页 对 应 页 面 文件 的 


在 HS 窗口 中 ， 用 鼠标 右键 单 击 “本 地 计算 机 ”一 “网 站 ”一 “ 鸭 认 网 站 ”命令 ， 再 右 
键 单 击 “ 上 默认 网 站 ”将 打开 如 图 1-10 所 示 的 快捷 荣 单 ， 用 户 可 进行 相应 操作 。 


な きま Tnternet 信息 服务 


文件 ) 操作 ぬ ) 査 者 ) 帮助 出) 


ゃ うっ 回 国 | 軟 団 還 


SS ll 


4: Internet 信息 服务 
日 - 筷 士 -01 (未 地 计算 机 ) 
コ 网 站 


日 


更 IIsHelp 


Printers 


は | 8 PY 打开 必 (0) 
四 -sz 默认 SIWT 列 筑 5 


pe 1 二 县 资源 管理 器 E) 


日 动 人 
停止 ) 


暂停 ⑭) 


新建 0) 
所 有 任务 g) 


ト 
ト 


查看 ⑰ 


ト 


重 命名 如 ) 
刷新 ) 


导出 列表 (L)... 


| 尾 | 


帮助 出) 


状态 


ci windows\help\iishelp 
C: WINIOWS\web\printers 


1-10 站 点 的 右键 快捷 荣 单 
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该 快捷 菜单 中 第 用 命令 的 意义 和 功能 如 下 : 
@ “资源 管理 器 ”， 可 以 月 动 Windows 资 源 管 理 器 ， 并 打开 CNmetputvwwwroot 文 件 夹 。 
@ “打开 ” 可 以 直接 打开 CNmetputwwwroot 文 件 夹 窗口 。 
@ “浏览 ?: 可 以 局 动 浏览 器 ， 并 打开 该 默认 站 点 。 男 外 ， 在 站 点 的 右键 快捷 订单 中 也 
可 以 控制 站 点 的 激活 或 禁止 状态 。 
@ “月 动 ” 可 以 激活 站 上 点， 以便 外 界 访问 。 
“停止 ” 停止 站 点 服务 ， 这 时 站 点 驶 同 外 界 完 全 断 开 ， 外 界 无 法 访问 。 
@ “ 匠 停 ”: 暂时 俘 止 站 点 服务 ， 可 以 重新 选择 该 命令 ， 以 重新 局 动 站 点 。 另 外 ， 在 站 
点 的 右键 快捷 来 单 中 也 可 以 对 站 点 进行 其 他 类 型 的 管理 。 
@ “新建 ” 下 一 级 亲 单 中 只 有 “创建 虚拟 目录 ”这 一 个 选项 ， 通 过 这 个 命令 可 以 建 并 
单独 的 虚拟 站 点 。 
@ “上 所 有 任务 ” 下 一 级 菜单 中 只 有 “权限 癌 寻 ”命令 ， 执 行 后 将 运行 “权限 癌 寻 ”对 
话 框 ， 在 这 里 可 以 设置 安全 属性 等 种 规 功 能 。 
@ “从 看 ”: 和 Windows 的 操作 答 看 功能 一 样 ， 用 来 显示 “名 称 ” 人 “路 径 ” 的 图 标 大 
小 ， 并 可 以 目 定 义 命 令 。 
@ “ 車 命名 ": 乍 狐 命名 站 点 的 名 称 。 
@ “刷新 ”: 可 以 对 站 点 进行 刷 独 ， 以 反映 最 近 对 站 点 进行 的 改动 。 
@ “导出 列表 ”: 执行 该 命令 后 将 日 动 生 成 一 个 .txt 文 档 ， 列 出 IIS 建 立 站 点 的 设置 情 
部。 
@ “属性 ”， 可 以 打开 “属性 ”对 话 框 ， 以 设置 站 点 属性 。 
@ “帮助 *” 可 以 打开 “帮助 ”对 话 杠 ， 里 面 有 关于 IS 设 置 的 相关 内 容 。 
加 创建 新 网 站 站 点 
要 利用 Dreamweaver CS5 进行 Web 应 用 程序 的 开发 ， 首 先 要 为 开发 的 Web 应 用 程序 建 
六 一 个 新 的 网 站 站 点 。 一 般 来 说 ， 可 以 采用 三 种 方法 建立 网 站 站 点 : 真实 目录 、 虚 拟 目 孙 和 
真实 站 点 。 最 党 用 有 的 方法 就 是 采用 虚拟 目录 创建 网 站 站 点 。 
使 用 虚拟 目录 创建 网 站 站 点 的 步骤 如 下 : 
启动 IS， 用 鼠标 右键 单 击 “ 默 认 网 站 ”选项 ， 打 开 如 图 1-10 所 示 的 快捷 
来 单 。 
从 快捷 末 单 中， 选择 “ 狐 建 ”一 “虚拟 目录 ”命令 ， 这 时 将 打开 如 图 1-11 所 
未 的 “虚拟 目录 创建 问 导 ”对 话 框 。 
单 击 “下 一 步 ” 按 钮 ， 在 “虚拟 目录 别名 ”对 话 框 中 的 “别名 ”文本 框 中 输入 
站 点 名 称 ， 假 说 这 里 输入 “website”， 如 图 1-12 所 示 。 
单 击 “ 下 一 步 ” 按 钮 ， 将 打开 如 图 1-13 所 示 的 “网 站 内 容 目 录 ” 对 话 框 ， 提 
示 用 户 输入 虚拟 目录 的 丰 实 位 置 ， 这 里 输入 的 路 任 为 D:\Flash, Flash 文件 夹 里 放置 的 束 是 网 
站 的 所 有 动画 文件 。 
单 击 “ 下 一 步 ” 按 钮 ， 将 打开 如 图 1-14 所 示 的 “访问 权限 ”对 话 框 ， 提 示 用 
户 为 当前 目录 设置 访问 权限 。 该 对 话 框 中 各 个 选项 的 意义 如 下 。 
@ “ 访 取 ” 选择 该 项 ， 则 人 允许 客户 谈 取 虚拟 目录 中 的 内 容 。 通 第 必须 选中 该 项 ， 人 否则 
用 户 无 法 访问 站 点 。 


EE 泊 民 玉 几 动态 网 站 开发 基础 


虚拟 目录 创建 网 号 


欢迎 使 用 虚拟 目录 创建 问 寻 


此 向 导 将 帮助 您 在 网 站 上 新 建 一 个 虚拟 目录 。 


单 击 “ 下 一 步 ” 按 钮 继续 。 


图 1-11 “虚拟 目录 创建 癌 导 ”对 话 框 


诬 拟 目录 创建 癌 守 


虚拟 目录 型 名 
必 颍 涯 虚 扒 目录 提供 一 个 简短 的 名 称 或 列 名 ， 以 便于 快速 5 上 用 。 


输 六 用 于 芍 得 Wab 诺 失 目录 硕 问 坎 限 的 列 名 。 使 用 的 命名 规 
则 应 与 目录 前 名 规则 相同 。 
列 名 (A): 


ebsi tl 


< 上 お) _ 取消 | 
图 1-12 输入 站 点 名 称 


诬 扫 目录 创建 同 号 


网 站 内 容 目录 
要 发 布 和 到 网 站 上 的 内 容 的 位 置 。 


输 闵 内容 所 在 的 目录 蹄 往 。 
目录 血 1 


i: Flash 叫 覧 下り... | 


图 1-13 输入 虚拟 目录 的 真实 位 置 
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@ “运行 脚本 《如 ASP)”: 选择 该 项 ， 则 允许 在 虚拟 目录 中 放置 包含 脚本 的 动态 网 页 ， 
以 实现 Web 应 用 程序 的 相关 功能 。 因 为 要 开发 基于 ASP 的 Web 应 用 程序 ， 所 以 应 该 
选中 该 项 。 


虚拟 目录 创建 闪 导 


设置 虚拟 目录 的 访问 梭 限 。 
允许 下 列 梭 限 : 


|y 运 运行 脚本 (HO ASF) GG) 
| 执行 好 ISAFI 应 用 程序 或 CGI) (E) 


| 写 入 ⑱) 
| 训 览 四 ) 
单 击 “ 下 一 步 ” 榨 钮 完成 向 导 。 


《 上 一 步 @) 取消 


图 1-14 设置 虚拟 目录 的 访问 权限 


@ “执行 (如 ISAPI 应 用 程序 或 CGI)” 选择 该 项 ， 则 在 该 虚拟 目录 中 执行 二 进 制程 
序 。 一 般 并 不 同 用 户 介绍 如 何 开 发 服务 器 端的 执行 程序 ， 所 以 该 项 可 以 不 选 。 

@ “ 写 入 ”: 选中 该 项 ， 则 允许 用 户 通 过 浏览 费 回 站 点 中 写 入 文件 。 对 于 一 个 安全 站 点 
来 说 ， 该 项 不 应 该 被 选中 ， 以 避免 用 户 从 您 的 站 点 中 读 取 源 文 件 ， 或 是 任意 删除 站 
点 中 的 文件 。 

@ “浏览 ”” 选中 该 项 ， 则 当 用 户 访问 该 虚拟 目录 时 ， 如 果 目 录 中 没有 默认 主页 ， 则 在 
浏览 堪 中 以 目录 的 形式 显示 站 点 中 的 所 有 文件 ， 通 常 ， 如 果 在 站 点 中 不 是 为 了 提供 
下 载 文件 ， 则 不 应 选中 该 项 。 

单 击 “ 下 一 步 ” 按 钮 ， 将 打开 “已 成 功 完成 虚拟 目录 创建 问 导 ”对 话 框 ， 

如 图 1-15 所 示 。 设 置 完 毕 ， 单 击 “ 完 成 ”按钮 即 完成 操作 。 


虚拟 目录 创建 向 导 


i 目录 创建 向 


单 击 “ 完 成 ”按钮 继续 


图 1-15 “已 成 功 完 成 虚拟 目录 创建 问 导 ”对 话 框 


动态 网 站 开发 基础 


民品 昌 设置 站 点 属性 


在 HS 中 可 以 设置 站 点 或 站 点 目录 的 多 种 属性 。 要 设置 站 点 或 目录 的 属性 ， 可 以 按照 如 (>) 
下 方法 进行 操作 :启动 IS, 然 后 在 IIS 窗口 左边 列表 框 中 选择 要 设置 属性 的 站 点 或 站 点 跌 
的 目录 ， 这 里 选择 “默认 网 站 ”选项 ， 然 后 单 击 鼠 标 右键 ， 选 择 “ 属 性 ”命令 ， 即 可 打开 站 
点 的 “默认 网 站 属性” 对话 框 ， 如 图 1-16 所 示 。 


时 世 网 站 对 性 
。 ITYT 基 | 自 定 尽 错误 服务 器 扩展 
网 站 | SEI 征 选 器 主 目录 立 档 目录 实 全 性 
网 站 标识 
描述 E): ET TE 
IF 地 址 总 1 | 全部 未 分 配 ) 所 
TCF 端 口 j: 30 | 
连接 
连接 超时 全: | ann 各 
悦 | 保持 TTF 连接 总 ) 


区 | 局 用 日 志 记 录 是 ) 


活动 日 志 格 式 (WY): 
|W3C 扩展 日 志 净 件 格 式 MI [属性 ). 


图 1-16 “默认 网 站 ”属性 ”对 话 框 


国 设置 “网 站 ”站 点 的 标识 和 连接 属性 

在 如 图 1-16 所 示 的 “网 站 ”选项 卡 中 ， 可 以 设置 用 于 标识 网 站 站 点 的 有 关 参 数 。 

@ “网 站 标识 ” 在 “网 站 标识 ”区 域 ， 可 以 重新 修改 站 点 的 “描述 ”名 称 、“ 卫 地址 ” 
和 “TCP 疹 口 ” 

@ “连接 ” 在 “连接 超时 ”文本 框 中 ， 可 以 设置 保持 连接 的 持续 时 间 。 一 旦 用 户 同 服 
务 右 的 连接 时 间 超 出 了 这 里 设置 的 时 间 ， 而 且 没 有 进行 任何 操作 ， 则 服务 器 将 断 开 
与 用 户 的 连接 ， 该 时 间 以 秒 为 单位 。 如 果 选 中 “保持 HTTP 连 接 ” 复 选 枉 ， 则 可 以 激 
活 网 站 站 点 与 HTTP 的 保持 连接 功能 。 

@ “启用 日 志 记 录 ” 如 果 选 中 “保持 HTTP 连 接 ” 复 选 枉 ， 则 可 以 激活 网 站 站 点 的 记录 
功能 ， 以 记录 用 户 活动 的 细节 ， 并 按 所 选 格 陈 创建 日 六。 通过 阅读 日 六 ， 可 以 了 解 
哪些 用 户 访问 了 站 点 ， 还 可 以 知道 用 户 访 问 了 哪些 信息 。 可 以 在 “活动 日 志 格 式 ” 
列表 中 选择 需要 的 格式 。 
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国 设置 主 目录 

在 站 扩 的 “默认 网 站 ”属性 ”对 话 框 中 单 击 “ 主 目录 ”选项 卡 ， 进 入 如 图 1-17 所 示 
的 对 话 框 。 主 目录 属性 设 蜀 相当 重要 ， 在 浏览 帮 里 输入 的 域名 指 问 的 文件 夹 丈 是 指 这 个 
主 目录 。 限 于 访 幅 ， 这 里 不 对 对 话 框 中 的 所 有 选项 进行 介绍 ， 只 介绍 一 些 较 重要 功能 的 


区 次 


默认 网 站 慣性 


HTTF 头 目 定 避 错 旋 
| 网 站 ”| ISAFI 文选 器 | 主 目录 | 广 档 
连接 到 资 禄 时 的 内 容 来 禄 : 
地) 此 计算 机 上 的 目录 疾 ) 
站 郧 一 各 计算 机 上 的 共享 (8) 
〇 ) 重定 向 到 WEL) 


下 地 路 十 站] ID: dssignem | 


品 写 入 
门 目 录 浏 览 蚀 ) 
应 用 程序 设置 


应 用 程序 名 Wi :车 认 应 用 程序 | 副 際 ) 
开始 位 置 ， WU 同時 > ] 
さ 配電 (5) 


执行 可 限 ) | 纯 脚本 
应 用 程序 保护 好 | 中 (共用 ) 


图 1-17 设置 主 目录 属性 


(1)“ 连 接 到 资源 时 的 内 容 来 源 ” 在 该 区 域 ， 可 以 选择 主 目 录 的 位 置 ， 其 中 包含 如 下 三 
个 选项 : 
@ “此 计算 机 上 的 目录 ” 选中 该 项 ， 则 将 站 点 的 主 目 录 设 置 在 本 地 计算 机 上 ， 这 时 可 
以 在 下 方 的 “本 地 路 人 径 ” 文 本 框 中 输入 目录 的 全 路 人 符 ， 如 Di\designem。 
@ “ 刃 一 台 计 算 机 上 的 共 圣 ” 选中 该 项 ， 则 可 以 将 站 点 的 主 目录 设 章 在 局 域 网 上 的 其 
他 计算 机 共享 目录 中 。 
@ “ 重 定 问 到 URL”: 选中 该 项 ， 则 将 访 站 点 指 回 另外 的 URL， 通 第 可 以 用 于 将 多 个 下 
地 址 指 癌 同一 个 站 点 的 情况 。 
(2)“ 本 地 路 径 ” 当选 中 “此 计算 机 上 的 目录 ”或 “ 另 一 台 计 算 机 上 的 共享 ”选项 时 ， 
会 在 对 话 框 上 显示 访问 许可 设置 的 内 容 项 ， 其 中 最 重要 的 是 “本 地 路 径 ” 文 本 框 中 输入 路 
径 ， 只 有 正确 输入 定义 站 点 的 路 径 才 可 以 访问 到 网 站 的 内 容 。 其 实 还 包括 “该 取 ” 和 “与 
入 ”网 个 选项 。 需 要 注意 的 是 ， 一 般 “ 读 取 ” 选 项 是 一 定 要 选中 的 ， 人 否则 无 法 访问 该 主 目录 
下 的 文件 ， 而 “ 写 入 ”功能 最 好 取消 。 
(3)“ 应 用 程序 设置 ” “应 用 程序 设置 ”可 以 控制 Web 应 用 程序 的 一 些 相 应 选项 。 所 谓 
应 用 程序 ， 指 的 是 两 个 被 标记 为 应 用 程序 的 局 动 点 目录 之 间 所 包含 的 全 部 目录 和 了 文件。 如果 
将 站 点 的 主 目录 标记 为 应 用 程序 局 动 点 ， 则 站 点 中 的 每 个 虚拟 目录 和 真实 有 目录 都 将 目 动 加 入 
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到 应 用 程序 中 。 建 议 将 站 点 的 主 目录 设置 为 应 用 程序 。 
(4)“ 执 行 权限 ”: “执行 权限 ”可 以 控制 应 用 程序 运行 的 权限 ， 其 中 包括 如 下 选项 ; 
e@ “无 ” 选中 该 项 ， 则 在 当前 选中 目录 中 不 允许 任何 程序 或 脚本 运行 。 
e@ “ 纯 脚 本 ”， 选 中 该 项 ， 则 使 映射 到 脚本 引擎 的 应 用 程序 可 以 在 该 目录 下 运行 ， 而 无 @) 
需 拥 有 “执行 ”权限 。 可 以 对 包含 ASP 脚 本 、Internet 数据 库 接 口 (IDC) 脚本 或 其 
他 脚本 的 目录 使 用 “脚本 ”权限 。“ 脚 本 ”权限 比 “ 执 行 >” 权限 安全 ， 因 为 在 这 种 权 
限 下 二 进 制 文件 是 无 法 运行 的 。 
@ “脚本 和 可 执行 文件 ” 选中 该 项 ， 则 允许 任何 应 用 程序 在 该 目录 中 运行 ， 包 括 映射 
到 脚本 引擎 的 应 用 程序 和 Windows NT 二 进 制 文件 (如 .dll 和 .exe 文 件 )。 
加 设置 默认 文档 
可 以 为 选中 的 站 点 或 目录 定义 默认 文档 ， 通 过 URL 地 址 访问 站 点 目录 时 ， 如 果 没 有 
明确 指定 要 打开 文档 的 名 称 ， 将 打开 这 里 设置 的 默认 文档 。 如 果 选 中 的 目录 是 主 目录 ， 
则 默认 文档 就 是 常 说 的 “主页 ”。 在 站 点 的 属性 对 话 框 中 ， 单 击 “ 文 档 ” 选 项 卡 ， 进 入 如 
1-18 所 示 的 对 话 框 ， 即 可 进行 相应 设置 。 


HITF 头 目 定 哆 错误 “服务器 扩展 
| 网 站 | ”ISAFI 簿 选 器 主 目录 式 柏 | ”目录 安全 性 | 


EE 


[局 用 文档 页 脚 血 ) 


柚 | 政 ][ 晴 9 [| 輸 ) 」 


图 1-18 设置 默认 文档 


默认 状态 下 ， 默 认 文 档 的 名 称 是 “Defaulthtm” 和 “了 Defaultasp”， 单 击 “ 添 加 ”按钮 ， 
可 以 添加 新 的 默认 文档 名 称 ， 单 击 “ 删 除 ” 按 钮 ， 可 以 删除 不 需要 的 默认 文档 名 称 。 单 击 文 
档 名 称 左 侧 的 箭头 按钮 因 和 加 ， 可 以 改变 默认 文档 的 优先 级 顺序 。 


设置 服务 器 站 点 


~, 
| 


4 AR Pr 
し 和 a 

| | 2 う ) 所 

で 、 WS 

se A . jj 

有 


yy 


设置 服务 右 站 点 后 ，Dreamweaver CS5 才能 在 页面 中 插入 合适 的 服务 右 脚 本 指令 。 如 琳 
选择 使 用 ASP 技术 ， 则 Dreamweaver CS5 将 插入 VBScript、JavaScript、ASPNET、C# 或 


一 和 
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ASPNET VB 脚本 ; 如 果 选 择 使 用 JSP 技术 ， 则 Dreamweaver CSS 插入 Java 代码 。 定 义 站 点 
以 及 议 置 站 点 的 方法 有 了 两 种 ， 一 种 是 通过 定义 站 点 同 导 来 定义 站 点 ， 另 一 种 方法 是 直接 定义 
站 上 点。 下面 承 定义 站 点 回 寻 的 方法 进行 介绍 。 

用 定义 站 点 问 导 定义 站 点 的 操作 步骤 如 下 : 

在 本 地 计算 机 D 盘 建 立 shop 站 点 文件 夹 ， 在 文件 夹 内 建立 images 子 文件 来 。 
启动 Dreamweaver CS$, 打電 Dreamweaver CSS 的 操作 界面 如 图 1-19 所 示 。 


D 文件 @) 编辑 (EF) 查看 (WV) 插入 (I) 修 改 (W) 格式 (0) 命令 (C) 站 点 (3) 宮口 W) ”和 玫 助 O00) | | 设计 器 v 


bp 


| Adobe BrowserLab | BrowserLab 


打开 最 近 的 项 目 主要 功能 


司 shoplindexasp の | ie CSS 检查 模式 
の | reglshowpassword.asp | css 和 用 門 用 
| reglshowduestion.asp の | 9 
| regllostpassword.asp P| 点 SP VBScript 区 四 动态 相关 文件 
| reghwelcorme.asp の | XSLT( 整 页 ) 

实时 视图 导航 
の | regluserdelete.asp の | | 
| regiuserdeleteok.asp | BrowserLah 集成 
P| regiuserupdateok.as の | 
ジー 加 更 多 . 
PD reglRegster.asp 

打下 二 


快速 六 站 AdebeG Creatiye Suite® 5 Web 
新 増 + 能 》 Premiun 
資源 > 通过 购买 Adobe Creative Suite 5 Web 


Fremium 获取 Adobe Dreamweaver CS5 
Drearmweaver Exchange » Frofessionals 


田间。 我 的 电脑 
田 - 网 上 邻居 
四 -句点 面 项 目 


1-19 Dreamweaver CSS 的 操作 界面 


执行 菜单 栏 上 的 “站 点 ”一 “管理 站 
点 ”命令 打开“ 管理 站 点 ”对 话 框 ， 如 图 1-20 
所 示 。 


在 该 对 话 框 的 左边 是 站 点 列表 框 ， 显 编辑 E)... 
示 了 所 有 已 经 定义 的 站 点 。 单 击 右边 的 “新 建 ” 按 复制 
钮 ， 则 打开 “站 点 设置 对 象 未 命名 打点 1” 对 话 册 除 包 ) 
框 ， 如 图 1-21 所 示 。 导出 (8)... 

在 “站 点 名 称 ” 文 本 框 中 输入 将 要 建 


立 的 站 点 名 称 。 这 里 输入 “shop” 作 为 站 点 的 名 
称 。 在 “本 地 站 点 文件 夹 ” 文 本 框 中 输入 为 
Di\shop\， 输 入 这 个 地 址 表示 是 本 地 计算 机 的 站 点 1-20 打开 的 “管理 站 点 ”对 话 杠 
的 地 址 ， 输 入 后 如 图 1-22 所 示 。 


站 点 谍 直 对 惫 未 命名 站点 1 


Dreamweaver 站 点 是 效 站 中 使 用 的 所 有 训 件 和 次 源 的 集合 。 Dreamweawer 
站 点 通 单 包 舍 两 个 部 分 ; 可 在 其 中 存 俏 和 涉 理 妆 件 的 计算 机 上 的 本 地 区 件 
来 ，| 训 下 可 在 其 中 将 相同 训 件 吉 市 天 web 上 的 服 箸 准 上 的 近 程 京 性 来 。 


您 可 以 在 此 让 当 Dreamweawer 站 点 选择 未 地 立 件 夹 和 名称 。 
站 点 名 称 ! | 未 前 名 站 点 1 
本 地 站 点 况 尾 来 ;| cDCocuments and SettingsadministratorMy Parumentsi 示 | 国 


图 1-21 打开 “站 点 设 置 对 象 ”对 话 框 


靖 点 设置 对 兽 shop 
Dreamweawer 站 点 是 障 站 中 人 重用 的 所 有 交 件 和 资源 的 集 言 。 Dreamweaver 


話 点 通常 包 舎 肉 條 部 分 : 可 在 其 中 存 情 和 处 理 朗 件 的 计算 机 上 的 本 地 区 件 
卖 ， 以 划 可 在 其 中 将 相同 区 件 支 布 到 web 上 的 服务 骼 上 的 远程 区 件 来 。 


您 可 以 在 此 处 漠 Dreamweawer 引 点 逃 振 率 地表 性 送 和 独 痢 。 
站 点 名 称 ; 
本 地 让 点 误 件 来; 円 


图 1-22 输入 站 扣 名 称 和 地 址 


输入 站 点 名 称 和 地 址 后 ， 单 击 “ 服 务 器 ” 列 选项 ， 进 行 站 点 的 服务 器 设置 ， 如 
1-23 上 所 示 。 通 过 该 对 话 框 ， 用 户 可 以 选择 一 种 服务 器 技术 。 通 过 选择 服务 器 技术 可 以 实 
现 动态 网 站 的 建设 ， 在 Dreamweaver CSS 中 包含 的 服务 器 技术 有 ASP JavaScript、ASP 
VBScrip、ASPNET、JSP 及 PHP MySQL 等 解决 方案 。 


站 点 设置 对 守 shop 


ーーーー 净 将 在 此 位 置 选择 学 载 wweb 上 的 页 面 的 服务 器 。 此 对 话 框 的 访 置 来 自 
Internet 服务 提供 两 iP 或 Web 管理 员 。 


些 盛 : 要 玉英 他 只 eammeaker 时 点 上 工藤 ， 殴 五 所 训 已 上 基 需 - 贡 员 亚 和 莹 证 到 en 并 雹 
调 砚 夯 ， 痪 只 所 交 出 一 信 旺 本 肾 达 部 夺 可 - 


| 连接 | 征程 “| 讽 也 | 


图 1-23 “站 点 设置 对 象 shop” 对 话 框 


单 击 对 话 框 上 的 “添加 新 服务 器 ”按钮 三 |， 打 开 “ 基 本 ”选项 卡 ， 在 里 而 对 
服务 器 进行 设置 ,“ 服 务 嚣 名称 ”文本 框 输入 名 称 为 shop,“ 连 接 方法 ”从 下 拉 列 表 项 中 选择 
“本 地 /网 络 ”， “服务器 文件 夹 ” 的 路 任 设 置 为 : D:\shop\, Web URL 网 站 地 址 ) 设置 为 : 
http://127.0.0.1/， 设 置 完成 后 ， 如 图 1-24 所 示 。 


半点 设置 对 家 shop 
| | 設置 
服务 器 名 种 
连接 方法 机 ep 发 
服务 器 文 和 天 [ep ーー 
web URL EE 


图 1-24 设置 服务 器 属性 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


单 击 “高 级 ”选项 卡 ， 打 开 服 务 亏 扩 术 设 症 和 面板， 这 里 单 击 选择 “服务 需 模 


型 ”下 拉 三 角 按钮 ， 在 弹出 的 菜单 中 选择 ASP VBScript 选项 ， 表 示 使 用 这 种 技术 开发 网 
站 ， 有 具体 的 设置 如 图 1-2 所 示 。 


清点 调 置 对 守 shop | © 


基本 Las 9 
远程 服务器 一 ー 
加 维护 同步 信息 
口 保存 时 自动 将 交 件 上 传 到 服务 器 
口 启用 交 件 取出 功能 
回 打 开 立 件 之 前 职 出 程 “| 测 二 | 
职 出 名 称 : | ] | 


Wh 六 这 


电子 邮件 地 址 ; | 


F 训话 服务 器 
服 范 器 幅 型 ;| 』5P MEScript 


图 1-25 设置 服务 器 技术 


设置 好 服务 器 技术 后 ， 单 击 “ 保 存 ” 按 钮 ， 则 会 打开 一 个 选择 存储 文件 位 置 的 
对 话 框 ， 如 图 1-26 所 示 。 


清点 度 置 对 宠 shop 


您 将 在 此 位 置 选 择 革 载 上 mg 上 的 页 面 的 服务 器 。 此 对 话 框 的 设置 来 自 
Internet 服务 提供 商 Pi 或 web 管理 局 。 


导语 : 要 弄 录 芒 DreamWeayer 半点 上 工件， 苍 二 证 定夺 并 上 必 省 胃 杰 萤 胡 邢 Wan 痊 膏 
凋 抽 顾 ， 莉 只 斋 让 一 个 虹 要 虹 窜 训 绩 可. 


| 连接 | 远程 “| 测 坛 | 
本 地 /网络 回回 


图 1-26 ”选择 存储 文件 的 位 置 


-A 
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说 明 : 
远程 和 测试 复 选 框 : 如 果 用 户 选择 了 该 项 ， 并 且 在 计算 机 上 安装 了 IIS， 则 可 以 在 本 地 
计算 机 上 编辑 和 测试 文件 。 


最 后 单 击 “保存 ”按钮 ， 即 可 以 完成 站 点 的 设置 。 到 这 里 融 完 成 了 本 地 站 点 服务 堪 的 规 
划 设 计 ， 通 过 这 一 个 关键 的 设置 可 以 方便 后 面 的 革 市 进行 设计 并 应 用 。 


是 与 ASP 有 关 的 数据 库 连 接 


目前 支持 ASP 的 数据 库 主 要 有 Microsoft Access 和 Microsoft SQL Server。 Microsoft 
Access 是 一 种 Windows 环境 下 的 关系 型 数据 库 系 统 ， 与 其 他 数据 库 相 比 ，Microsoft 
Access 所 提供 的 各 种 工具 既 人 简单 又 方便 ， 因 此 本 书 所 讲述 的 数据 库 主 要 以 Microsoft 
Access 为 主 。Microsoft SQL Server 是 一 种 客户 端 /服务 器 模式 的 关系 型 数据 库 管 理 系统 ， 


使用 Transact-SQL 语句 在 服务 器 和 客户 疾 之 间 传 送 资 料 请 求 ， 本 书 对 Microsoft SQL 
Server 只 做 人 条 单 介 绍 。 


利用 数据 库 连 接 ， 可 以 将 一 个 现 有 的 数据 库 同 当前 的 Web 环境 结合 起 来 ， 通 过 简单 、 
统一 的 编程 接口 和 脚本 代码 ， 实 现 对 数据 库 的 控制 。 要 利用 ASP 访问 数据 库 中 的 数据 ， 肯 
和 完 应 该 构建 系统 环境 同 数据 库 的 连接 。 

使 用 ASP 网 页 访问 网 络 数 据 库 的 执行 过 程 ， 如 图 1-27 所 示 。 


ASP 指 令 
VBScript 
HTML 


客户 端 电脑 


图 1-27 使用 ASP 网 页 访问 网 络 数据 库 的 执行 过 程 


在 图 1-27 中 ， 客 户 疹 安 逆 了 浏览 堪 ， 网 站 服务 器 端 安 厂 了 网 站 服务 器 和 SQL Server 数 
据 库 服 务 左 。 使 用 ASP 操作 数据 库 的 执行 过 程 如 下 : 


第 1 音 GP DE 


用 户 在 客户 疹 用 浏览 郁 问 网 站 服务 噩 发 送 HTTP 协议 的 请 求 。 

如 果 请 求 要 读 取 的 是 HTML 文件 ， 则 网 站 服务 器 直接 将 这 个 HTML 文件 
返回 。 

如 果 请 求 要 读 取 的 是 ASP 文件 ， 则 网 站 服务 器 就 要 执行 ASP 文件 。 在 ASP 文 
件 中 ， 如 果 有 访问 数据 库 的 操作 ， 则 通过 ADO， 而 ADO 再 通过 ODBC 访问 数据 库 。 网 站 


服务 右 将 访问 结果 生成 HTML 文件 ， 并 将 生成 的 HTML 文件 返回 。 
在 客户 端的 浏览 器 中 ， 解 释 执行 返回 的 HTML 文件 ， 最 终 显示 服务 器 响应 结 
果 的 页 面 。 
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无 论 连 接 什么 样 的 数据 库 ， 首 先 都 要 创建 数据 库 到 ODBC 0 车 接 ， 因 为 在 创建 数据 库 
之 前 ， 必 须 提 供 一 条 可 以 使 ADO 定位 、 标 识 与 数据 库 通 信 有 的 途径 。 在 Windows 系统 中 ， 
ODBC 的 连接 主要 通过 ODBC 数据 源 管理 器 完成 。 

对 于 Windows XP Professional 操作 系统 的 用 户 来 说 ， 建 立 ODBC 数据 源 管 理 器 的 操作 
步骤 如 下 : 

选择 “开始 ”一 “设置 ”一 “控制 面板 ”命令 ， 打 开 “ 控 制 面板 ”对 话 框 ， 如 
图 1-28 所 示 。 


: 文件 ) 编辑 应 ) 查看 收藏 多 工具 て ) 帮助 加 
OO © 落球 世 xW 国 ・ 
:地 址 四 区 控 制 面板 。 そそ 司 一 一 マ | 国 苇 到 : 上 网 助手 ”分 与 暂 停 拦 截 


ks b> 
NN 控制 面板 » ペー 
Hero Symantec 打印 村 和 人 苇 1 天 | 
は 切换 到 分 类 视图 项 Imagelrive Livellpdate 真 


电源 选项 0 管理 工具 键盘 区 任 劳 填 划 
る Windows Update 
@) 帮助 和 支持 


“ * 
ーー 


任务 栏 和 [ 日 期 和 时 间 担 描 伺 和 照 添加 或 册 除 
开始 」 荣 单 相机 程序 


受 


添加 硬件 。 ”网 络 连 接 。 净 件 夹 选 项 


B » Eg 


邮件 游戏 控制 器 语音 


1-28 “控制 面板 ”对 话 框 


在 该 对 话 框 中 双击 “管理 工具 ”图 标 忠 ， 将 打开 “管理 工具 ”对 话 框 ， 如 
图 1-29 所 示 。 


一 人 
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辐 回 加 
: 文件 @) 编辑 侍 ) 查看 QW 收藏 入 工具 ) ”帮助 和 
sm・@6- 共 | の 時 用 間 ※| 国 - 
: 地 址 0) | 上 号 管理 工具 站 因 轩 有 :上 网 助手 ・ 本 暂停 拦截 


Server Extensions 
管 


快捷 方式 


其 它 仔 置 全 


は 控制 面板 计算 机 管理 


に 我 的 文档 快捷 方式 


站 共享 文档 

ーー の ー 数 指 源 (mnEC) 
量 我 的 电脑 了 快捷 方式 

WJ 网 上 邻居 2 KE 


き 
ーー UI 
て 


详细 信息 


管理 工具 
系统 立 件 来 


图 1-29 “管理 工具 ”对 话 框 


双击 “数据 源 (ODBC)” 图 标 训 ， 即 可 打开 “ODBC 数据 源 管理 器 ”对 话 
框 。 一 个 典型 的 ODBC 数据 源 管理 器 如 图 1-30 所 示 。 


10DBC 数据 淹 管 理 各 
用 户 DSH | 系统 DSW | 文件 SW | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 


用 户 数 据 福 0 : 


名 称 | _ 療 加 個 ).… | 


dEASE Files Nicrosoft dBase Driver [dbE] 
DEwebshop Driver do Microsoft hecess mdb) 册 降 (R] | 
Fxcel Files Microsott Excel Driwer [ 冰 .x1Ls] 


MS hccess Database Microsoft hecess Driver mdb 配置 (時 | 


1-30 “ODBC 数据 源 管理 器 ”对 话 框 


“ODBC 数据 源 管 理 器 ”对 话 框 中 包含 了 多 个 选项 卡 ， 可 以 进行 各 种 有 关 
ODBC 的 操作 。 在 默认 状态 下 ,“ODBC 数据 产 定 理 占 ”对 话 框 已 经 内 置 了 多 种 数据 库 
的 驱动 程序 ， 单 击 “ 驱动 程序 ”选项 卡 ， 束 可 以 但 看 当前 要 连接 的 数据 库 类 型 是 否 位 于 
其 中 ， 其 中 “Driver do Microsoft Access(*.mdb)” 选 项 即 是 使 用 Access 数据 库 的 驱动 程 
序 ， 如 图 1-31 所 示 。 


事 1 章 7 动态 网 站 开发 基础 


10DBC 数据 源 管 理 器 
用 户 nsm | 系统 DSW | 立件 nSm 驱动 程序 | 跟踪 “| 连接 池 | 关于 | 
系统 所 安装 的 nnEr 上 蝶 动 程序 中 ): 


Driver do Microsoft Excel tk. ls 
Driver do Microsoft Faradox [*.db ) 
Driver para ロ Microsott Visual FoxFro 
Nicrosoft fccess Driver tt.mdtb) 
Nicrosoft hecess-Treiber 种 .mdb] 
Nicrosoft dBase Driver I*. dbf) 
Nicrosoft dBase YFP Driver [*. dbF] 
Nicrosoft dBase-Treiber (+. dbf) 


党 に 


0DBC 驱动 程序 多 许 志 持 nmEC 的 程序 从 nnEr 沙 据 产 藻 职 傅 息 。 
"a 要 安装 新 的 最 动 程序 ， 圭 使 用 其 安装 程序 。 


图 1-31 选择 数据 源 的 驱动 程序 


注意 : 

DSN ( Data Source Name， 数 据 源 名 称 )， 表 示 用 于 将 应 用 程序 和 某 个 数据 库 相 连接 
的 信息 集合 。ODBC 数据 源 管 理 器 使 用 该 信息 创建 指向 数据 库 的 连接 。 通 常 DSN 可 以 
保存 在 文件 或 注册 表 中 。 一 旦 创建 了 一 个 指向 数据 库 的 ODBC 连接 ， 同 该 数据 库 连 接 
的 有 关 信 息 就 被 保存 在 DSN 中 ， 而 在 程序 中 如 果 要 对 数据 库 进行 操作 ， 也 必须 通过 
DSN 进行 。 


通过 图 1-32 可 以 看 到 有 三 种 数据 源 名 称 ， 分 别 是 “用 户 DSN”、“ 系 统 
DSN” 和 “文件 DSN”， 这 表明 通过 “ODBC 数据 源 管 理 器 ”对 话 框 ， 可 以 创建 这 三 种 类型 
的 DSN。 下 面 将 分 别 介绍 三 种 类 型 的 DSN 的 不 同 之 处 : 

@ “用 户 DSN”: 用 户 DSN 是 锌 用户 下 接 使 用 的 DSN， 而 ASP 古 不 能 使 用 它 的 ， 因 此 对 

于 本 书 来 说 ， 不 需要 构建 这 种 用 户 DSN。 用 户 DSN 通 常 保存 在 注册 表 中 ， 可 以 使 用 
regedt32 或 regedit 命 令 访问 。 

@ “系统 DSN”: 系统 DSN 是 由 系统 进程 (如 IS〉 所 使 用 的 DSN， 系 统 DSN 信 息 同样 被 

存储 在 注册 表 中 。 

@ “文件 DSN”: 文件 DSN 同 系统 DSN 的 区 别 是 它 你 存在 文件 中 ， 而 不 是 注册 表 中 。 默 

认 状 态 下 ， 文 件 DSN 保 存在 C:\Program Files\Common Files\ODBC\Data Sources 文 件 夹 
中 。 

文件 DSN 的 优点 在 于 便于 移动 ， 因 为 DSN 信息 保存 在 独立 的 文件 中 ， 如 果 用 户 希 望 将 
整个 Web 应 用 程序 和 数据 库 移动 到 其 他 计算 机 中 ， 只 需 连 同 生 成 的 DSN 文件 一 起 移动 即 
可 。 而 系统 DSN 因为 信息 是 保存 在 注册 表 中 的 ， 所 以 移动 起 来 焉 不 那么 方便 了 。 但 是 ， 如 
果 要 经 和 党 修改 数据 库 ， 文 件 DSN 丈 显 得 不 如 系统 DSN 方便 。 使 用 系统 DSN 时 ， 如 和 果 要 改 
变 所 使 用 的 数据 库 ， 只 需 人 简单 地 修改 Windows 的 注册 表 。 而 使 用 文件 DSN， 则 必须 每 次 都 
修改 Globalasa 文件 。 另 外 ， 如 末 需 要 在 计算 机 上 的 许多 不 同 应 用 程序 中 使 用 同一 个 DSN, 
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那么 显然 使 用 系统 DSN 更 加 方便 。 

由 于 本 书 使 用 系统 进程 IS 作为 服务 器 的 平台 ， 所 以 通常 将 ODBC 创建 为 “ 系 
统 DSN”。 创建 系统 DSN， 首 先 要 启动 ODBC 数据 源 管理 器 ， 然 后 选择 “系统 DSN” 选 项 
卡 ， 如 图 1-32 所 示 。 


10ODBC 束 据 谣 管 理 需 
用 户 DsW 系统 DSHW | 立件 DsW | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系 纺 数据 彰 总 ) : 


dsnmessaee Driver do Microsoft hccess tt.mdb) 
Microsoft hecess Driver [*.mdb) 


图 1-32 “系统 DSN” 选 项 卡 


单 击 “ 添 加 ” 投 钮 ， 将 打开 如 图 1-33 所 示 的 “创建 独 数 据 源 ”对 话 框 ， 提 示 
选择 需要 的 数据 源 驱 动 程序 。 


亨 建 独 数 据 弄 
选择 悠 想 为 其 安装 数据 源 的 豫 动 程序 (8)。 


da Microsoft para argquivos texto [+, 
rwer do Microsoft Aceess [mdb) 

dn Microsoft dEase [ キ . dh] 

do Microsoft Exeel tk.xls) 

do Microsoft Faradox [*. db 1 


Driver para o Microsott Visual FoxFro 


Nicrosoft 点 eeess Driver 名 .mdb) 
Nicrosoft hecess-Treiber mdb 
Microsoft dBase Driver tk. dbf) 
Microsoft dEase VFF Driver tt. db£) 
そ | 


图 1-33 ”选择 数据 源 驱 动 程序 


由 于 本 书 中 使 用 的 数据 库 是 Access， 所 以 需要 创建 指 癌 Access 数据 库 的 连 
接 ， 因 此 应 该 在 驱动 程序 列表 中 选择 “Driver do Microsoft Access 〈*.mdb)” 选 项 。 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


单 击 “ 完 成 ”按钮 ， 将 打开 如 网 1-34 所 示 的 “ODBC Microsoft Access 安 装 ” 
对 话 框 ， 提 示 输 入 数据 源 名 称 ， 并 选择 要 连接 的 数据 库 文件 。 


ODBC 下 icrosoft Access 安装 


沼 据 淹 : 考 必 ) testDatabase © 
品 明 (| ItastHatabasl ] 
数据 库 


数据 库 : 帮助 HM) | 
选择 [8)... | 创建 C0)... | 昼 握 下り. | 压缩 册 )... | = | 


系统 数据 库 


取消 


* 无 还) 
”数据 库 上 : 


[ES | 选项 (0) >> | 


图 1-34 ”设置 数据 源 名 称 及 连接 


在 “数据 源 名 ”文本 框 中 输入 需要 的 数据 源 名 称 ， 这 里 输入 “testDatabase ”， 
在 “描述 ”文本 框 中 输入 希望 的 描述 信息 ， 如 “testDatabase ”。 

单 击 “ 选 择 ” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 框 ， 可 以 选择 适合 的 Access 文 
件 ， 如 图 1-35 所 示 。 


数据 库 名 0 目 服 : 
[shop. mdb d: "shopmdb 


并 件 关 型 IT); ョ Ba 【『」・ 


[hecess 郑 据 库 (ば mr | a 。 


图 1-35 “选择 数据 库 ” 对 话 框 


单 击 “确定 ”按钮 确认 操作 后 ， 返 回 如 图 1-34 所 示 的 对 话 框 中 。 

在 “ODBC Microsoft Access 安装 ”对 话 框 中 还 有 其 他 一 些 选项 ， 这 些 选 项 
在 此 不 需要 使 用 ， 直 接 单 击 “ 确 定 ” 按 钮 ， 即 可 返回 到 ODBC 数据 源 管理 器 的 “系统 
DSN” 选 项 卡 中 ， 并 且 可 以 看 到 ， 刚 刚 创 建 的 系统 DSN 名 称 显 示 在 “系统 数据 源 ” 列 表 
中 ， 如 图 1-36 所 示 。 

单 击 “确定 ”按钮 ， 确 认 操 作 并 关闭 “ODBC 数据 源 管理 占 ” 对 话 框 。 
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1npBc 款 据 谣 管 理 需 
用 户 nsm 系统 DSH | 文件 DsW | 驱动 程序 | 跟踪 “| 连接 池 | 关于 | 
系统 数据 洒 店 ): 


驱动 程序 


Driwver do Microsoft hecess .mdb) 


图 1-36 ”新 创建 的 系统 DSN 


上 创建 ADO 连 接 


如 果 要 在 Dreamweaver CSS 中 使 用 数据 库 ， 还 必须 创建 数据 库 连 接 。 在 建立 连接 时 必须 


选择 一 种 合适 的 连接 类 型 ， 如 ADO、JDBC 或 Cold Fusion。 选 择 建 立 不 同 的 连接 类 型 ， 其 操 
作 方 法 及 步骤 也 不 一 样 。 如 果 使 用 ASP 技术 ， 则 必须 创建 “运行 时 刻 ADO 数据 库 连 接 ” 

在 Dreamweaver CSS 中 创建 数据 库 连 接 时 ， 可 以 创建 两 种 类 型 的 连接 : 设计 时 刻 连 接 和 
运行 时 刻 连 接 。 

回 设计 时 刻 连接 : 就 是 在 进行 Web 应 用 程序 设计 时 使 用 的 连接 。 

加 运行 时 刻 连接 : 就 是 在 真正 使 用 浏览 器 浏览 站 点 时 所 使 用 的 连接 。 

为 Web 应 用 程序 总 是 要 被 激活 的 ， 换 句 话 说， 站 点 总 是 要 被 浏览 的 ， 所 以 在 
Dreamweaver CSS 中 运行 时 刻 连接 的 操作 是 必 不 可 少 的 。 如 果 用 Dreamweaver CSS 来 开 友 网 
站 建设 ， 设 计时 刻 连接 是 必 不 可 少 的 。 

大 多 数 情 况 下 ， 不 必 明 确 指定 设计 时 刻 连接 ， 而 只 需 将 设计 时 刻 连 接 同 运行 时 刻 连接 设 
置 为 一 人 改 ， 束 可 以 确保 无 论 是 设计 时 还 是 运行 时 ， 都 能 够 正常 访问 到 数据 库 。 

对 于 设计 时 刻 连接 来 说 ， 决 定 连接 方式 的 因 么 就 是 用 户 当 前 的 开 友 环境 ， 这 与 在 站 点 中 
要 使 用 的 技术 无 天 。 使 用 Windows 计算 机 并 使 用 Access 驱动 程序 ， 则 需要 创建 ADO 连 
接 。 而 最 终生 成 的 站 点 中 采用 什么 技术 ， 则 是 在 运行 时 和 ee 
刻 连接 方式 中 所 设置 的 。 RO 


、 ee 、 若 要 在 该 页 面 上 使 用 动态 数据 : 
回 建立 Dreamweaver CS5 在 运行 时 刻 的 ADO 连接 J 」 団 波 件 人 陸 交点 
ZL i = Wy 挡 闪 型 ロ 

在 Dreamweaver CSS 中 打开 前 面 创 建 的 设置 让 点 的 测 寺 服务 器 


shop 站 点 ， 建 立 一 个 “index.asp” 页 面 ， 选 择 菜 单 栏 上 


的 “窗口 ”一 “数据 库 ” 命 令 ， 打 开 “ 应 用 程序 ”面板 


中 的 “数据 库 ” 选 项 卡 ， 如 图 1-37 所 示 。 
图 1-37 “数据 库 ” 选 项 卡 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


单 击 该 选项 卡 中 的 “+” 号 按钮 机 ， 从 打开 的 下 拉 荣 单 中 选择 “数据 源 名 称 
(DSN)” 命 令 ， 将 打开 “数据 源 名 称 (DSN)” 对 话 框 ， 如 图 1-38 所 示 。 


数据 淹 名 称 (D58} 


名 
数据 源 名 称 DSH) i 
用 玉名 | | 
密码 :| | 
Dreamweaver 应 连接 : し ) 使用 測 試 服 党 器 上 的 DSH 
③) 使 用 本 地 DSH 


图 1-38 “数据 源 名 称 “(DSN)” 对话 框 

选中 “使 用 本 地 DSN” 单 选 按 钮 。 

在 “连接 名 称 ” 文 本 框 中 输入 连接 的 名 称 ， 这 里 输入 的 是 “testDatabase”。 

在 “数据 源 名 称 ” 下 拉 列 表 框 中 选择 一 个 数据 源 名 称 ， 选 择 已 经 建立 好 的 
“testDatabase ”数据 源 。 

在 “用 户 名 ”和 “密码 ”后 和 面 的 文本 框 中 分 别 输 入 用 户 名 及 密码 ， 此 两 项 也 可 
以 不用 填 与 。 

现在 需要 检测 连接 是 否 建 并 成 功 ， 单 击 “ 测 试 ” 按 钮 ， 弹 出 如 图 1-39 所 示 的 
对 话 框 ， 表 示 建 立 连接 成 功 。 

单 击 “确定 ”按钮 ， 返 回 到 “数据 产 ” 面 板 ， 可 以 看 到 在 “数据 源 名 称 ” 对 话 
框 中 可 以 看 到 新 建立 的 连接 ， 如 图 1-40 所 示 。 


数据 库 エロ テー コー ロロ ーー 站 
二 一 其 档 类 型 : hsF Script | 


tastlatabasa 

回 - 脚本 编制 
回 誤 ”版 权 表 

圏 产品 表 

轩 产品 主 类 别 加 

B88| 

8 


名 
明 
田 
图 記 品 子 美 到 
田 


DEreanmyweadver 


_ 卫 ) 成功 创 哇 连接 脚本 。 


请 起 圏 订单 表 


| 用 -天 订单 产品 v 
图 1-39 测试 连接 成 功 图 1-40 建立 连接 后 的 “数据 库 ” 对 话 框 


外- 由- 由- 由- 由: 


加 建立 Dreamweaver CS5 在 设计 时 刻 的 ADO 连接 

在 Dreamweaver CSS 有 的 “文档 ”窗口 中 ， 选 择 末 单 栏 上 的 “窗口 ”一 “数据 
库 ” 命 令 ， 打 开 “ 数 据 库 ” 和 面板 。 

单 击 该 对 话 框 中 的 “+” 号 按钮 双 ， 从 打开 的 下 拉 采 单 中 选择 “上 自 定义 连接 字 
符 串 ”命令 ， 打 开 “ 目 定义 连接 字符 串 ” 对 话 框 ， 如 几 1-41 所 示 。 

在 “连接 名 称 ” 文 本 框 中 输入 连接 的 名 称 〔 一 般 可 以 输入 “conn+ 数 据 库 名 
称 ” 作 为 连接 的 名 称 )。 这 里 输入 连接 名 称 为 “conn ”。 

在 “连接 字符 串 ” 文 本 框 中 输入 服务 器 上 的 数据 库 的 名 称 ， 如 “testDatabase ”。 
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选中 “使 用 此 计算 机 上 的 驱动 程序 ” 单 选 按 钮 。 

现在 可 以 检测 连接 是 否 建立 成 功 ， 单 击 “ 测 试 ” 按 钮 ， 如 果 弹 出 如 图 1-38 所 
示 的 对 话 框 ， 则 表示 建立 连接 成 功 。 

单 击 “ 确 定 ” 按 钮 确认 操作 并 关闭 “上 自 定义 连接 字符 串 ” 对 话 框 ， 在 “数据 
库 ” 对 话 框 中 可 以 看 到 新 建立 的 连接 ， 如 图 1-42 所 示 。 


圭一 其 档 类 型 :MSF VEScript 


日 中 cor A 
日 ~- 芭 ”脚本 编制 
国 产品 表 

轩 产品 主 业 别 

图 ”产品 子 类 别 

: 团 ”订单 表 

天 订单 产品 是 


图 1-41 “和 目 定义 连接 字符 串 ” 对 话 框 图 1-42 ”建立 的 新 连接 


自 定义 连接 字符 串 


十 | 


连接 名 称 : lcorm | 
连接 字符 审 : t estDatabase| 


Dr eamweaver 应 连接 : 使 用 测试 服务 器 上 的 驱动 程序 
名 使 用 此 计算 机 上 的 驱动 程序 


而 四 -由 - 贞 一 中: 
Eo 
国 


计生 访问 SQL Server 数 据 库 


ASP 应 用 程序 使 用 ADO (ActiveX Data Object) 对 象 访 问 SQL Server 数据 库 。ASP 网 


页 源 程序 由 三 种 语法 成 分 组 成 :标记 语句 、 脚 本 语句 和 ASP 内 建 对 象 语句 。 

@ “标记 语句 ” 用 来 修饰 页 面 的 外 观 。 标 记 由 HTML (Hypertext Makeup Language， 
超 文 本 标记 语言 ) 编写 。HTML 是 一 种 包含 超 链 接 的 网 页 元 素 的 标记 语言 。 在 ASP 
网 页 中 ， 使 用 HTML 语句 设计 输入 数据 的 界面 在 浏览 右 中 显示 的 式样 和 将 访问 数据 
库 的 结果 返回 浏览 右 。 

@ “脚本 语句 ”脚本 语句 中 包含 变量 、 表 达 式 、 函 数 以 及 流程 控制 语句 等 语法 成 分 。 
HTML 中 没有 这 些 编写 程序 所 应 有 的 语法 成 分 。 在 ASP 网 页 中 ， 使 用 脚本 语句 扩展 
网 页 处 理 数据 的 功能 。 和 常见 的 脚本 语言 有 VBScript、JavaScript 等 语言 ， 本 节 仅 介绍 
VBScript。 VBScript 是 Visual Basic 的 一 个 子 集 ， 在 ASP 网 页 中 ， 可 将 VBScript 插入 
到 HTML 的 脚本 标记 中 。 

@ “ASP 内 建 对 象 的 特殊 性 ” 它们 是 在 ASP 网 页 内 预定 义 的 。 在 脚本 中 ， 使 用 它们 之 
前 无 顷 创 建 。 在 ASP 网 页 中 ， 使 用 ASP 内 建 对 象 的 方法 创建 ADO 対象 。 然 后 , 使 
用 ADO 对 象 访问 SQL Server 数据 库 。 

在 ASP 页 面 中 ， 访 问 SQL Server 数据 库 的 步骤 如 下 : 

使用 ASP 対象 server 的 createobject 方法 ， 创 建 ADO 的 连接 对 象 connection， 


例如 : 


set conn=server.createobject("adodb.connection") 


使用 ASP 対象 server 的 createobject 方法 ， 创 建 ADO 的 记录 和 集 对 象 recordset, 
例如 : 


set recs=server.createobject("adodb.recordset") 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


使 用 连接 对 象 conn 的 open 方法 ， 连 接 数据 源 ， 例 如 : 
str="driver={SQL Server};database=lib;server=(local);uid=sa;pwd=sa" 
conn.open str 
str 是 连接 字符 串 。 其 中 ，driver 指定 ODBC 的 驱动 程序 ，database 指定 数据 库 ;，server © 
指定 服务 器 ，uid 指定 用 户 ，pwd 指定 用 户口 令 。 J 
使 用 记录 集 对 象 recs 的 open 方法 ， 获 取 数 据 ， 例 如 : ba 
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sql="select * from books order by 登录 号 
recs.open sdl,conn,1,1 
sql 是 SQL 语句 字符 串 ， 指 定 对 数据 库 的 访问 。 记 录 集 对 象 的 open 方法 有 4 个 参数 ， 
分 别 为 : 访问 数据 库 的 语句 、 连 接 对 象 、 游 标 类 型 和 锁定 类型 。 
根据 应 用 程序 的 需求 ， 对 结果 集 recs 进行 处 理 。 比 如 ， 使 用 表格 显示 recs 的 
内 容 。 如 果 SQL 语句 中 包含 输入 的 参数 ， 那 么 应 在 编写 SQL 语句 字符 串 之 前 ， 从 ASP 対象 
Request 的 集合 form 和 QueryString 中 ， 获 取 SQL 语句 中 所 需要 的 参数 。 


高 级 SQL 语句 创建 记录 集 


SQL 是 Structured Query Language 【结构 陈 奏 询 语言 ) 的 缩写 ， 是 对 数据 库 中 的 数据 进 
行 组 织 、 管 理 和 检索 的 一 种 工具 。 当 用 户 想 要 检索 数据 库 中 的 数据 时 ， 可 以 通过 SQL 语句 
发 出 请 求 ， 然 后 DBMS 对 该 SQL 请 求 进行 处 理 并 检索 所 要 求 的 数据 ， 最 后 将 其 返回 给 用 
户 ， 这 个 过 程 被 称 之 为 数据 库 人 查询 。 在 Dreamweaver CSS 中 使用 SQL 构建 数据 库 和 但 询 ， 能 
够 上 自动 连接 数据 库 对 象 ， 用 户 不 需要 书写 复 森 SQL 代码 。 但 是 对 于 一 些 复杂 的 查询， 如 使 
用 蜗 级 “记录 集 ” 对 话 框 查询 数据 亩 ， 束 有 必要 了 解 SQL 语句 ， 局 级 “记录 集 ” 对 话 框 如 
1-43 所 示 。 


8 Recordset1 


testlatabase wv 


本 表 格 添加 到 SaL: 
四 内 视图 


3 現存 千 程 一 一 


IRTIER BY 


图 1-43 ”高 级 “记录 集 ” 对 话 框 
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SQL 是 一 种 数据 库 子 语言 ，SQL 语句 可 以 被 租 入 到 男 一 种 语言 中 ， 从 而 使 其 具有 数据 
库存 取 功 能 。SQL 语法 易于 理解 ， 大 多 数 SQL 语句 都 是 直 述 其 意 的 。SQL 也 是 一 种 交互 式 
查询 语言 ， 人 允许 用 户 直 接 查 询 存 储 数据 ， 利 用 这 一 交互 特性 ， 用 户 可 以 在 很 短 的 时 间 内 查询 
相当 复杂 的 问题 。 下 面 就 简要 介绍 一 下 如 何 使 用 简单 的 SQL 查询 语句 。 


i 查询 整个 表 


查询 是 SQL 语言 的 核心 ， 而 用 于 表达 SQL 查询 的 SELECT 语句 的 功能 较 强 ， 同 时 也 是 
较为 复杂 的 SQL 语句 ， 它 从 数据 库 中 检索 数据 ， 并 将 得 询 结 末 提供 给 用 户 。 

当 建 立 数据 库 连 接 后 ， 选 择 来 单 栏 上 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绪 
定 ” 对 话 框 ， 单 击 该 面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 下 拉 菜 单 中 选择 “记录 集 〈 查 询 )” 
命令 ， 则 打开 “记录 集 ” 对 话 框 。 

单 击 该 对 话 框 右 侧 的 “高 级 ”按钮 ， 切 换 到 高 级 “记录 集 ” 对 话 框 ， 该 对 话 框 
显示 如 图 1-44 所 示 。 


1 Recordset1 


i : |testllatabase 


: ISELECT* 
FEnM 用 户 表 


添加 到 SQL: 


SELECT 


"HERE 


DRDER BY 


图 1-44 “记录 集 ” 对 话 框 
将 “名 称 和 “连接 ”参数 设置 完成 后 ， 在 SQL 文本 区 域 中 和 直接 输入 但 询 整 个 表 的 语句 : 


SELECT* 
FROM 用 户 表 


这 条 SQL 语句 表示 从 “bookdata” 数 据 表 中 合 询 所 有 了 字段 中 的 数据 ， 也 就 是 所 
有 数据 。 此 时 可 以 测试 该 语句 的 功能 ， 单 击 高 级 “记录 集 ” 对 话 框 中 的 “ 训 试 ” 投 钮 ， 将 打 
开 如 图 1-45 所 示 的 记录 集 。 

蛙 击 “确定” 控 钮 ， 关 闭 该 窗口 ， 返 回 到 噩 级 “记录 集 ” 对 话 框 。 在 该 对 话 框 
中 单 击 “ 人 确定” 按钮 ，Dreamweaver CSS 会 日 动 把 记录 添加 到 “应 用 程序 ”面板 中 的 “ 绑 
定 ” 选 项 卡 的 有 效 数 据 源 列表 中 ， 如 图 1-46 所 示 。 


CF 


数据 库 | 卷 定 | 服务 器 行为 | 上皇 


+ 一 并 档 类 型 : ASF VESeript [| 


密码 真 .… 性 别 电话 手机 电 .. 人 攻 址 说 明 属性 
admin admin 818... 138... des... 北 ..， 管理 员 adni 
T71011 林 小 明 去 688... 138... hai..， 北 .. 我 ... 


用 ... 
admin 


二 
1-45 测试 状态 的 记录 集 1-46 绑 定 的 记录 集 对 话 框 


打开 高 级 “记录 集 ” 对 话 框 ， 在 该 对 话 框 中 的 SQL 文本 区 域 中 输入 : 
SELECT 用 户 名 
FROM 用 户 表 
这 条 SQL 语句 表示 从 bookdata 数据 表 中 查询 “产品 编码 ”这 个 字段 中 的 数据 。 
此 时 可 以 测试 该 语句 的 功能 。 单 击 高 级 “记录 集 ” 对 话 框 中 的 “测试 ”按钮 ， 将 打开 如 
图 1-47 所 示 的 记录 集 。 


测试 5Q9L 指 令 


前 25 个 (F) 下 25 个 (8) 


1-47 测试 状态 的 记录 集 


2 


pe 


二 


单 击 “ 人 确定” 按钮， 关闭 该 窗口 并 人 返回 到 融 级 “记录 集 ” 对 话 框 。 在 该 对 话 框 中 单 
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击 “ 人 确定” 按钮 ，Dreamweaver CS5 会 自动 把 记录 添加 到 数据 绑 定 对 话 框 的 有 效 数 据 源 
列表 中 。 


-~ 


查询 符合 一 定 条 件 的 特定 字段 的 


得 询 功 能 中 包括 得 询 符合 一 定 条 件 的 特定 字段 ， 如 条 没有 一 定 的 SQL 语言 基础 ， 要 下 
接 在 高 级 “记录 集 ” 对 话 框 中 编写 命令 是 有 一 定 困 难 的 ， 所 科 的 是 ， 在 Dreamweaver CS5 
中 ， 用 户 可 以 通过 “记录 集 ” 高 级 设置 面板 直接 得 询 符合 一 定 条 件 的 特定 字段 ， 下 面 束 来 介 
绍 一 下 如 何 进行 操作 : 

打开 光 租 中 本 章节 建立 的 index.asp 页 面 ， 单 击 “ 应 用 程序 ”面板 中 的 
“ 绑 定 ”选项 卡 ， 双 击 该 选项 卡 中 的 “记录 集 (conn)” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 
如 图 1-48 所 示 。 

单 击 “ 箭 选 ” 下 拉 列 表 框 右 侧 的 第 一 个 下 拉 三 角 投 钮 关 ， 打 开 下 拉 列 表 ， 选 择 
要 议 置 得 询 的 特定 字段 选项 ， 这 里 选择 “产品 ID ”选项 。 然 后 单 击 右 侧 的 第 二 个 下 拉 三 角 
按钮 w， 在 打开 的 下 拉 列 表 中 选择 设置 查询 的 方式 为 “=”( 完 全 等 于 ) 选项 。 

单 击 “ 辞 选 ”下 拉 列 表 框 第 二 行 的 第 一 个 下 拉 三 角 按 钮 等， 打开 下 拉 列 表 ， 选 
择 “URL 参数 ”选项 ， 在 其 右 侧 的 文本 框 中 输入 “产品 DD” 表示 从 其 他 页 和 面 传递 到 该 页 耐 
的 “产品 卫 ” 等 于 数据 库 中 的 “产品 ID ” 


注意 : 

该 设置 在 制作 各 系统 时 经 常 使 用 ， 如 制作 新 闻 系统 时 ， 单 击 某 一 个 新 闻 标 题 时 能 打 
开 详 细 的 页 面 ， 使 用 的 就 是 这 种 查询 ， 关 于 查询 的 其 他 参数 设置 将 在 本 书后 面 的 章节 中 
进行 介绍 . 


on | 
连接 : testDatabase 。 


表格 :| 产 品 表 | 


列 : で ) 全 部 馈 选 定 的 : 


图 1-48 打开 的 “记录 集 ” 对 话 框 


单 击 “测试 ”按钮 ， 则 弹出 “请 提供 一 个 测试 值 ” 对 话 框 ， 在 “测试 值 ” 文 本 
框 中 输入 “2” 如 图 1-49 所 示 。 


E 敵 二 二 请 沁 动态 网 站 开发 基础 


| 


请 提供 训话 值 唉 UET 大 数 : 产品 ID 
時 


图 1-49 打开 的 “请 提供 一 个 测试 值 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 ， 就 可 以 碍 找到 第 2 条 数据 相关 的 内 容 ， 如 图 1-50 所 示 。 


测试 5QL 指 邻 


产品 编码 产品 正面 产品 衣 类 列 | 产品 说 明 
JadewenDD2 uploadfile. .. uploadfile... 婚 站 婚 名 好 看 的 很 


图 1-50 ”测试 结果 


单 击 “ 确 定 ”按钮 ， 返 回 “ 记 录 集 ”对 话 框 ， 单 击 “ 高 级 ”按钮 ， 打 开 高 级 
“记录 集 ” 对 话 框 ， 如 图 1-51 所 示 ， 可 以 看 到 系统 自动 加 入 的 SQL 命令 。 


名 称 : 司 計 


连接 : | testDatabase 


SQL: SELECT * 
FROM 产品 表 
WHERE [产品 ID] = MMColFaram 


| コ 


MMColF ar am : 
类 型 : 1c 
默认 但 : 1 


添加 到 SQL: 


SELECT 


WHERE 


DRDER BY 


狼 ”预存 过 程 


图 1-51 打开 的 高 级 “记录 集 ” 对 话 杠 
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记录 排序 


打开 “记录 集 ” 对 话 框 ， 单 击 “ 排 序 ” 下 拉 列 表 框 右 侧 的 第 一 个 下 拉 三 角 按钮 各， 打 
开 下 拉 列 表 ， 选 择 要 设 章 排 序 的 衬 段 选项 ， 如 这 里 选择 “产品 卫 ” 选 项 。 然 后 单 击 右 侧 的 
第 二 个 下 拉 三 角 按 钮 男 ， 在 打开 的 下 拉 列 表 中 选择 设置 排序 方式 为 “降序 ”， 如 图 1-52 
所 示 。 


名称 |eom | 
连接 : | testDatabase 加 
表格 : | 产品 表 v 

列 : 心 全 部 〇 选 定 的 : 


排序 : 产品 IT ww 


图 1-52 设 营 排序 字段 


这 样 的 设置 可 以 使 查询 的 记录 按 加 入 的 产品 ID 号 降序 排列 。 

通过 以 上 几 个 简单 的 实例 可 以 看 出 ，SQL 的 SELECT 语句 和 英文 语法 很 相像 。SELECT 
语句 的 完整 格式 包括 6 个 语句 ， 其 中 SELECT 和 FROM 语句 是 必须 包含 的 ， 其 他 语句 可 以 
任 选 ， 每 个 语句 的 功能 如 下 : 

国 Select 语句 

Select 语句 列 出 所 有 要 求 SELECT 语句 检索 的 数据 项 。 它 放 在 SELECT 语句 开始 处 ， 指 
定 此 查询 要 检索 的 数据 项 。 这 些 数据 项 通常 用 选择 表 表 示 ， 即 一 组 用 “,” 隔 开 的 选择 项 。 
按照 从 左 到 右 的 顺序 ， 每 个 选择 项 产生 一 个 列 的 查询 结果 ， 一 个 选择 项 可 以 是 以 下 项 目 中 的 
ルイ: 

@ 別名 : 标识 FROM 语句 指定 表 中 的 列 。 如 果 列 名 作为 选择 项 ， 则 SQL 直接 从 数据 库 

表 中 的 每 行 取 出 该 列 的 值 ， 再 将 其 放 在 得 询 结束 的 相应 行 中 。 

@ 常 数 : 指定 在 查询 结果 的 每 行 中 都 放 上 该 值 。 

@ SQL 表达 式 : 说 明 必 须 将 要 放 入 查询 结果 中 的 值 按 表 达 式 的 规定 进行 计算 。 

国 From 语句 

From 语句 列 出 包含 所 要 查询 数据 的 表 ， 它 由 关键 字 FROM 后 跟 一 组 用 喜 号 分 开 的 表 名 
组 成 。 每 个 表 名 都 代表 一 个 包括 该 查询 要 检索 数据 的 表 。 这 些 表 称 为 SQL 语句 的 数据 源 ， 
因为 伍 询 结果 都 源 于 它们 。 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


加 Where 语句 

Where 语句 只 查询 某 些 行 中 满足 一 定 条 件 的 数据 ， 这 些 行 用 搜索 条 件 描述 。 

加 Group By 语句 
Group By 语句 指 定 汇总 查询 ， 即 不 是 对 每 行 产 生 一 个 查询 结果 ， 而 是 将 相似 的 行进 行 (>) 


分 组 ， 再 对 每 组 产生 一 个 汇总 结果 。 

加 Having 语句 

Having 语句 产生 由 Group By 得 到 的 某 些 组 的 结果 ， 和 Where 语句 一 样 ， 所 需要 的 组 也 
用 一 个 搜索 条 件 指定 。 

国 Order By 语句 

Order By 语句 将 但 询 结 来 按 一 列 或 多 列 进行 排 夺 。 如 果 省 略 此 语句 ， 则 查询 结 来 将 是 无 
序 排列 的 。 


Section _ 


创建 ASP 动 态 对 象 


所 有 的 数据 库 操 作 ， 都 是 根据 碍 询 条 件 从 数据 库 中 挑选 出 符合 需要 的 记录 ， 在 “ 绑 定 ” 
面板 中 绑 定 记录 集 ， 通 过 在 页 面 上 增加 或 删除 记录 集 对 象 来 实现 操作 的 。 由 于 显示 在 页 面 上 
的 内 容 是 不 固定 的 ， 是 随 看 数据 库 俘 询 结 来 的 变化 而 变化 的 ， 因 此 ， 在 页 面 上 显示 数据 库 数 
据 的 操作 ， 也 被 称 为 “添加 动态 对 象 ”。 本 节 将 从 整体 上 介绍 添加 动态 对 象 的 步 又 和 方法 以 
及 相关 的 知识 。 


天河 生 创建 动态 对 象 的 步 又 


使用 Dreamweaver CSS 创建 动态 对 象 的 方法 和 步骤 如 下 : 

创建 静态 页 面 。 在 设计 动态 网 页 的 过 程 中 ， 为 了 把 握 页 面 的 总 体外 观 ， 可 以 先 
将 网 页 设计 成 一 个 静态 页 面 。 设 计 好 页 面 的 总 体 布 局 后 ， 再 癌 页 面 中 添加 动态 对 象 。 

创建 数据 源 及 记录 集 。 数 据 源 可 以 是 一 个 记录 集 对 象 、 返 回 记 录 集 对 象 的 命令 
对 象 ， 也 可 以 是 包含 递交 按钮 的 HTML 表单 或 其 他 元 素 。 完 成 数据 源 的 定义 之 后 ， 在 数据 
绑 定 面板 中 ， 束 能 够 显示 出 相应 的 数据 源 内 容 。 

指定 要 显示 动态 对 象 的 区 域 。 在 页 面 中 绘制 出 要 容纳 动态 对 和 象 的 地 方 。 正 和 常情 
况 下 ， 动 态 对 象 将 被 显示 在 表单 中 。 

动态 对 象 绑 定 。 从 数据 绑 定 面板 中 ， 选 择 要 显示 在 页 面 上 的 动态 对 象 ， 并 皇 入 
到 页 面 中 指定 的 位 置 上 。 这 时 Dreamweaver CSS 会 自动 问 页 面 中 添加 相应 的 服务 器 病 脚 本 ， 
以 实现 动态 对 象 的 显示 。 

添加 服务 融 行 为 。 为 页 面 上 的 动态 对 象 添 加 服务 器 行为 ， 通 过 行为 控制 完成 指 
定 任务 。 

以 上 就 是 构建 一 个 动态 对 象 的 大 致 过 程 ， 其 中 第 4 步 动 态 对 和 象 绑 定 就 是 这 一 六 中 要 介绍 
的 添加 动态 对 象 操作 。 
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1.6.2 


添加 动态 对 象 的 万 法 


在 Dreamweaver CS5 中 ， 可 以 采用 多 种 方法 在 页 面 中 添加 动态 对 象 ， 例 如 ， 可 以 利用 
“ 绑 定 ”面板 添加 动态 对 象 ， 也 可 以 利用 “属性 ”面板 添加 动态 对 象 ， 还 可 以 用 
Dreamweaver CS5“ 文 档 ” 窗 口中 的 菜单 完成 动态 对 象 的 添加 。 在 Dreamweaver CSS 中 ， 在 
页 面 中 添加 动态 对 象 的 基本 方法 如 下 : 

从 “ 绑 定 ”面板 中 选择 要 显示 的 数据 源 项 。 如 果 是 “记录 集 ” 类 型 的 数据 源 ， 
则 选择 其 中 的 学 段 ， 如 果 是 “服务 器 对 象 ” 类 型 的 数据 源 ， 则 选择 数据 源 本 吴 。 

将 选择 的 数据 源 项 拖 忠 到 文档 中 需要 的 位 置 上 ， 或 是 将 插入 点 放 到 文档 中 需要 
的 位 置 ， 再 单 击 “ 绑 定 ” 面 板 上 的 “插入 ”按钮 L_ 搬入 _]。 

当 动 态 对 和 象 被 添加 到 页 面 中 以 后 ， 会 以 占 位 符 的 形式 强 显 示 在 页 面 中 ， 因 为 像 这 种 动态 
对 和 象 会 占据 一 定 的 文档 空间 ， 因 此 将 它 称 为 “ASP 占 位 符 ” 图 1-53 显示 了 插入 <%= 
(conn.Fields.Item(" 产 品 编码 ").Value)%> 数 据 源 时 的 占 位 符 。 


Dw 文件 (7) 编辑 (EF) ”查看 (Y) 插入 (IT) 修 改 (WW) 格式 (Q) 命令 (C) 站 点 (53) 窗口 (W) 帮助 (TD | 
E:【 出 版 社 * 机 炉 工 下 出 版 社 い 新 建 六 性 実 い 光 癌 い codetchap01 い indez.asp 


| 设计 器 ・ 


indez.asp X 


CIA testDatabase. asp 


标题 : 大 标题 立 档 


LA 设计 | | 实时 代码 に マイ 


| 实时 视图 | 槍 査 る. 


pa 地址: Eile:///E 


f 出 版 社 / 机 械 工 业 出 版 社 / 新 建 恕 件 夹 / 光 琢 /code/ chap01; 


BU1 Im 


RAR ORDER BY [ 广 hpID] DESC" 
conm cmd.Prepared = true 


品 eo 


へ 

使 用 SQL 查询 记录 集 
Set conm = conn cmd.Execute + ca 
cornn numRows = 0 绑 定 记 录 集 ; 
を > 
<IDOCTYPE html PUBLIC "-//W3C//DTD 
XHTML 1.0 Transitional//EN" 
"http: アア mm. パロ FTR/xhtm11/DTD /xhtm 


a 四半 


ll-transitional. dtd"> 

<html xmlns= 

"http: nrr WU3.DLdy 1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" : 
content="text/html; charset=utf-8" /> | 
<title> 无 标题 次 档 < /jtitle> 
<A/head> 


| ~ Sc 
で 名 


<boady> 

<p> 使 用 sQL 查 询 记 录 集 < jp; 

<p> 堵 定 1 : EE 
EE /p> 

</body> 

</html> 

< を 

conn. Close【(】 

Set conn = Nothing 


[mGQ 100% v394 x 463v 2K/1 秒 Unicode (UTF-8) 


图 1-S3 显示 的 动态 对 象 


如 果 插 入 的 动态 对 象 是 Request《〈 请 求 变 量 ) 参数 ， 并 且 指 定 了 集合 类 型 ， 
类 型 .变量 名 } 的 形式 ， 如 {Request.MM user} 。 

如果 没有 指定 Request《〈 请 求 变 量 ) 所 使 用 的 集合 ， 或 是 将 Session (阶段 变量 ) 或 
Application (応用 程 序 変量 ) 参数 作为 活动 内 容 添加 到 文档 中 ， 则 会 采用 {ASP 对 象 名 .变量 
名 } 的 方式 ， 如 {Application.MM user} 。 


则 采用 {集合 


E 沁 二 二 请 沁 动 态 网 站 开发 基础 


[Ee 定义 数据 源 


在 将 动态 对 象 添 加 到 网 页 中 以 前 ， 必 须 定 义 一 个 数据 源 来 提供 动态 对 象 。 数 据 源 可 以 是 
记录 集 的 一 个 域 、HTML 表单 的 提交 值 或 是 服务 占 对 象 、 请 求 变 量 、 阶 段 变 量 或 应 用 程序 变 
量 等 。 数 据 源 的 来 源 实际 上 分 为 两 大 类 ， 一 闫 是 记录 集 ， 主 要 以 请 求 变 量 的 形式 出 现 ， 另 一 
类 是 服务 器 对 象 ， 主 要 以 请 求 变 量 、 阶 段 变 量 或 应 用 程序 变量 的 形式 出 现 。 在 “ 绑 定 ”面板 
上 ， 显 示 了 数据 源 的 类 型 ， 如 图 1-54 所 示 。 

记录 集 是 最 常 使 用 的 数据 源 ， 在 ASP 中 ， 记 录 集 是 通过 构建 请 求 变 量 实现 的 。 记 录 
集 可 以 看 成 是 临时 的 数据 表 ， 其 中 的 每 一 列 束 是 一 个 字段 ， 而 每 一 行 束 是 一 条 记录 。 问 
页 面 上 添加 动态 对 象 ， 其 实 束 是 从 记录 集 的 临时 数据 表 中 ， 将 要 显示 的 字段 内 容 放 入 页 
面 的 过 程 。 

国 定义 请 求 变量 的 数据 源 

请 求 变 量 是 ASP 技术 中 用 于 传递 数据 的 最 第 用 的 对 象 ， 它 主要 用 于 从 浏览 占 中 读 取 
递交 的 数据 ， 并 传递 到 服务 器 上 。 定 义 Request (请 求 变 量 ) 类 型 的 数据 源 ， 其 方法 和 步 
又 如 下 : 

在 Dreamweaver CSS 中 打开 一 个 建立 好 的 动态 网 页 ， 选 择 有 菜单 栏 上 的 “和 窗口 ” 
一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 和 面板。 在 数据 “ 绑 定 ”面板 中 单 击 加 号 “+” 按 钮 型 ， 在 打 
开 的 下 拉 末 蛙 中 选择 “请 求 变 量 ” 命 令 ， 如 图 1-55 所 示 。 


Pi 一 
HH に 


EE 算 定 Pe 
+ 一 况 档 类 型 ASF WEScript 


记录 集 5 查询 
前 令 预 仓 过 程 ) 
请求 变量 

阶段 变量 

应 用 程序 变量 


Spry 涛 措 们 


荣 职 数据 漂 ... 


l A EP 


图 1-54 数据 绑 定 面板 中 的 数据 源 图 1-55 ”执行 “请 求 变量 ”命令 


打开 “请 求 变量 ”对 话 框 ， 单 击 “ 类 型 ”文本 框 右边 的 下 拉 三 角 按钮 *， 打 开 
下 拉 六 蛙 ， 从 中 可 以 选择 请 求 变量 要 使 用 的 集合 类 型 ， 如 图 1-56 所 示 。 如 来 选择 “请 求 ” 
选项 ， 则 表明 使 用 默认 集合 ， 即 Request.QueryString 集合 。 

该 下 拉 列 表 中 各 个 选项 的 意义 和 功能 如 下 : 

@ RequestCookie: 用 于 访问 和 存 取 保存 在 浏览 器 病 的 Cookie 数 据 。 

Request.QueryString: 用 于 从 浏览 右 中 读 取 以 GET 方 法 递交 的 数据 。 
Request.Form: 用 于 从 浏览 右 中 读 取 以 POST 方 法 递交 的 数据 。 
Request.ServerVariables: 用 于 获取 服务 需 疾 的 环境 变量 。 
Request.ClientCertificates: 用 于 获取 客户 端的 身份 权限 数据 。 


テン 
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选择 完 使 用 的 集合 类 型 之 后 ， 在 “和 名称” 文本 框 中 输入 变量 名 称 ， 如 
“MM user”， 如 图 1-37 所 示 。 


”|Reguaest+t.Cookie 
Eequest. uerystring 
Eequest. Form 
Eequest. ServerVariables 
Reguest. ClientCertificates 


图 1-56 选择 请 求 变 量 类 型 图 1-57 设置 “请 求 变 量 ” 名 称 


设置 完成 后 ， 单 击 “ 人 确定 ”按钮 ， 即 完成 了 数据 源 的 创建 。 同 时 在 “ 绑 定 ” 面 
板 中 将 显示 创建 的 数据 源 名 称 ， 如 图 1-58 所 示 。 重 長 上 面 的 操作 , 可以 添加 多 條 靖 求 変量 
数据 源 。 

国 定义 阶段 变量 的 数据 源 

在 ASP 中 ， 阶 段 变量 主要 用 于 创建 会 话 作用 域 变量 ， 即 同 每 个 用 户 本 身 相关 的 变量 。 
定义 阶段 变量 的 数据 产 ， 其 方法 和 步骤 如 下 : 

选择 菜单 栏 上 的 “窗口 ” ~“ 绑 定 ” 命 令 ， 打 开 “ 绑 定 ” 面 板 。 在 “ 绑 定 ” 面 
板 中 单 击 “ 十 ”号 按钮 天， 在 打开 的 下 拉 沫 单 中 选择 “阶段 变量 ”命令 ， 些 时， 将 打开 “ 阶 
段 变量 ”对 话 框 ， 如 图 1-59 所 示 。 
I = Ns 
+ 一 全 档 办 型 : hsF YEScript 


上 记录 集 (comm 
に | 各 Reqest 


名 称 ， sl 


图 1-58 ”建立 的 请 求 变 量 数据 源 图 1-59 “阶段 变量 ”对 话 框 


在 “名 称 ” 文 本 框 中 输入 阶段 变量 名 称 ， 如 输入 “MM _user”。 

设置 完成 后 ， 单 击 “ 确 定 ” 鬼 钮 ， 确 认 操 作 ， 则 完成 了 数据 源 的 创建 。 同 时 在 
数据 绑 定 面 板 中 将 显示 创建 的 数据 源 名 称 ， 如 图 1-60 所 示 。 重 复 上 面 的 操作 ， 可 以 诬 加 多 
个 阶段 变量 数据 源 。 

加 定义 应 用 程序 变量 的 数据 源 

在 ASP 中 ， 应 用 程序 变量 主要 用 于 创建 应 用 程序 作用 域 变 量 ， 即 在 整个 应 用 程序 执行 
期 间 所 有 人 都 可 以 使 用 的 变量 。 定 义 应 用 程序 变量 的 数据 源 ， 其 方法 和 步骤 如 下 : 

选择 末 单 位 中 的 “窗口 ”一 “ 绑 定 ”命令 ,打开 “ 绑 定 ” 和 面板 。 在 数据 “ 绑 
定 ” 面 板 中 单 击 “+” 号 按钮 蜀 ， 在 打开 的 下 拉 菜 单 中 选择 “应 用 程序 变量 ”命令 ， 此 时 ， 
将 打开 “应 用 程序 变量 ”对 话 框 ， 如 图 1-61 所 示 。 


动态 网 站 开发 基础 


圭一 况 档 类 型 : ASF VWEScript 


[项 ”记录 集 [conn) 
3 Request 
日 请 Sessinn 


部 定 到 |: 
1-60 ”创建 的 阶段 变量 数据 源 1-61 “应 用 程序 变量 ”对 话 框 


在 “名 称 ” 文 本 框 中 输入 应 用 程序 变量 名 称 ， 如 “MM user”。 

设置 完成 后 ， 单 击 “ 确 定 ” 投 钮 ， 确 认 操 作 ， 即 完成 了 数据 源 的 创建 。 同 时 在 
数据 绑 定 面板 上 将 显示 创建 的 数据 源 名 称 ， 如 图 1-62 所 示 。 重 复 上 面 的 操作 ， 可 以 诊 加 多 
个 应 用 程序 变量 数据 源 。 


剖 避 第 姓 定 最 务 右 行 广 
二 一 其 档 娄 型 :ASF YBScript で 


源 
[记录 集 [eonn) 
MO Reqmest 
清 Sessiorn 


ee hpEPlication 


饰 定 到 |， 
1-62 创建 的 应 用 程序 变量 数据 源 


加 删除 数据 源 

删除 数据 源 的 操作 步 又 如 下 : 

在 数据 “ 绑 定 ”和 面板 中 的 数据 源 列 表 中 ， 选 择 需 要 删除 的 数据 源 。 
单 击 “-” 号 按钮 即 可 完成 删除 操作 。 


] 他 0 web2oHHHHHHHHL 


通过 第 1 半 的 学 习 ， 我 们 已 经 掌握 了 动态 网 页 制作 的 基础 知识 ， 也 了 解 到 制作 动态 网 页 
之 前 需要 制作 出 静态 网 页 。 网 页 设计 发 展 到 现在 ， 已 经 使 用 div+CSS 布局 的 Web 2.0 标准 ， 
相对 于 代码 条 理 混 乱 、 样 式 结构 杂乱 的 表格 布局 ，CSS 带 来 了 全 新 的 布局 方法 ， 使 网 页 设计 
更 轻松 、 更 自由 。 本 章 将 详细 介绍 使 用 Web 2.0 标准 设计 网 页 布局 的 方法 ， 为 下 面 动态 功能 
模块 的 建设 做 好 前 期 准备 工作 。 


ET 了 


教学 重点 


div+CSS 布局 方法 に 


列表 元素 布 局 に 
CSS 含 模型 ウ 
元 素 的 非常 规定 位 方式 に 
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div+CSS 布 局 方 法 ] 


在 XHTML 中 应 用 div+CSS 标签 进行 网 页 布局 是 目前 最 狐 的 网 页 制作 技术 ，Dreamweaver 
CSS 软件 中 也 严格 要 求 使 用 这 种 技术 进行 排版 。 在 这 里 ， 使 用 CSS 代码 控制 布局 可 以 使 网 页 更 
加 符合 Web 2.0 标准 。 


div 标 签 的 CSS 控 制 方 


div 标签 在 Web 2.0 标准 的 网 页 中 使 用 非常 频繁 ， 相 对 于 其 他 XHTML 元 素 ，div 有 什么 特 
别 之 处 呢 ? 其 实 div 标签 ， 跟 其 他 元 素 类 似 ， 是 一 种 网 页 编排 的 元 素 ， 需 要 通过 使 用 CSS 代 
人 码 ， 对 其 进行 样式 的 控制 。 

div 标签 是 双 标 签 ， 是 以 <div></div> 的 形式 和 存在， 其间 可 以 放置 任何 内 容 ， 包 括 其 他 的 
div 标签 。 也 就 是 说 ，div 标签 是 一 个 没有 任何 特性 的 容器 而 已 。 

创建 一 个 标准 的 XHTML 1.0 文档 ， 命 名 为 divindex.html， 编 写 divindex.html 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title>div 标签 </title> 

</head> 

<body> 

<div> 第 1 个 div 标签 </div> 

<div> 第 2 个 div 标签 </div> 

<div> 第 3 个 div 标签 </div> 

<div> 第 4 个 div 标签 </div> 

</body> 

</html> 


建立 站 点 文件 夹 dv， 并 设置 好 HS， 在 浏览 器 地 址 栏 中 输入 http://127.0.0.1/divindex.html， 
有 其 体 浏览 效果 如 图 2-1 所 示 。 

没有 CSS 的 帮助 ，div 标签 没有 任何 特别 之 处 ， 只 是 无 论 如 何 调整 浏览 器 窗口 ， 每 个 
div 标签 都 各 占 一 行 。 即 默认 情况 下 ， 一 行 上 只 能 容纳 一 个 div 标签 。 

那么 怎么 才能 实现 对 div 标签 的 CSS 控制 呢 ? 这 里 通过 id 选择 符 同 div 加入 CSS 代 
価 , 使 div 拥有 背景 色 以 及 宽度 ， 修 改 divindex.html 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transittonal/EN" "http://www.w3. 
org/TR/xhtml1/D1D/xhtml1-transittonal.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 


:和博 和 Web 2.0 标 准 静 态 网 页 的 搭建 


翅 diz 标 签 一 Nicrosoft Internet Explorer 回回 四 
: 文件 @) 编辑 人 E) 查看 @ 收藏 和 工具 (I) 帮助 由 
Om OO EE Pm km Oo ase 
; 地 址 0) | 緒 ] http: Ar127.0.0. 1/divindex. html ン | 转 到 
第 1 个 div 标 签 
第 2 个 div 标 签 


第 3 个 div 标 答 
第 4 个 div 标 签 


>»> 


移 Internet 


2-1 实例 运行 的 效果 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>div 标签 </title> 
<style type="text/css"> 
#nol,#no2{background-color:#eee; 


} 
#no3,#no4{background-color:#999; 
width:300px: 
} 
</style> 
</head> 
<body> 


<div id="no1"> 第 1 个 div 标签 </div> 
<div id="no2"> 第 2 个 div 标签 </div> 
<div id="mo3"> 第 3 个 div 标签 </div> 
<div id="mo4 ウ 第 4 个 div 标签 </div> 
<7body> 
</html> 


在 浏览 器 地 址 栏 中 输入 http:/127.0.0.1/divindex.html， 浏 览 器 的 运行 效果 如 图 2-2 所 示 。 


到 div 标签 = icrosoft Internet Explorer 加 回国 
: 文件 ) 编辑 下) 查看 名 ”收藏 史 ) 工具 G) 医 助 ⑪) 如 


OO OO- EO 才 次 类 轩 岂 -这 日 : 口 
; 地 址 m) 人 ttp:/7127.0.0. 1/divindex. html  “ 国 转 到 


» 


第 1 个 diy 标 签 
第 2 个 diy 标 签 


入 Internet 


2-2 设置 背景 后 的 div 标签 


アブ Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 。 


通过 背景 色 的 设置 ， 可 以 看 出 对 div 的 CSS 控制 只 需要 对 需要 控制 的 div 命名 id, 然 后 
写 入 相应 的 CSS 控制 代码 ， 即 可 以 自动 实现 控制 。 但 是 从 图 2-2 中 ， 我 们 可 以 看 到 div 标签 
默认 占据 一 行 ， 宽 度 也 为 一 行 的 宽度 。 通 过 宽度 的 设置 可 以 友 现 ， 并 不 是 因为 div 的 宽度 为 
一 行 ， 导 致 无 法 容纳 后 面 的 div 标签 ， 而 是 无 论 宽度 多 小 ， 一 行 始 终 只 有 一 个 div 标签 ， 读 
者 须 说 记 。 

div 标签 作为 网 页 CSS 布局 的 主要 元 素 ， 其 优势 非常 明显 。 相 对 于 表格 布局 ，div 更 加 
灵活 ， 因 为 div 具 起 一 人 没有 任 何 特性 的 容器 , CSS 可 以 非常 灵活 地 对 其 进行 控制 ， 组 成 
网 页 的 每 一 块 区 域 。 在 大 多 数 情况 下 ， 仅 仅 通 过 div 标签 和 CSS 的 配合 ， 即 可 完成 页 面 的 
布局 。 


| XHTML 中 的 块 状元 素 和 内 联 元 素 


XHTML 的 布局 核心 标签 是 div，div 属于 XHTML 中 的 块 状元 素 。XHTML 的 标签 默认 
为 两 种 元 素 ， 一 种 是 块 状元 素 ， 男 一 种 是 内 联 元 素 。 

国 块 状元 素 

该 元 素 是 矩形 的 ， 有 上 自己 的 高 度 和 宽度 。 默 认 情 况 下 ， 在 父 容 右 中 占据 一 行 ， 同 一 行 无 
法 容纳 其 他 元 素 及 文本 。 其 他 的 元 素 将 显示 在 其 下 一 行 ， 简 单 地 说 ， 我 们 可 以 看 作 它 们 是 被 
块 状元 素 “ 挤 ”下 去 的 。 块 状元 素 束 是 一 个 矩形 容器 ， 边 缘 非 常 便 ，CSS 设置 了 高 度 和 宽度 
后 ， 形 状 无 法 被 改变 。 

于 内 联 元 素 

和 块 状元 素 相 反 ， 内 联 元 素 没有 固定 形状 ， 也 无 法 设置 宽度 和 高 度 。 内 联 元 素 形状 由 其 
内 含 的 内 容 雇 定 ， 所 以 在 宽度 足够 的 情况 下 ， 一 行 能 容纳 多 个 内 联 元 素 。 如 果 说 块 状 元 素 是 
一 个 “全 盒子 ”那么 内 联 元 素 束 是 一 个 软 软 的 “布袋 子 ”( 形 状 由 内 容 决定 )。 

块 状元 素 适 合 于 大 块 区 域 的 排版 ， 所 以 常用 来 布局 页 面 。 而 内 联 元 素 适 合 于 局 部 元 素 的 
样式 设置 ， 所 以 常用 于 设置 局 部 文学 样式 。 


div 元 素 的 样式 设置 


要 使 用 div 元 素 进 行 网 页 布局 ， 首 先 应 学 会 使 用 CSS 灵活 控制 div 元 素 的 样式 。 本 节 束 
力 绕 几 个 常用 的 实例 来 介绍 div 元 素 的 多 种 样式 设置 ， 使 读者 快速 理解 div 元素 。 

作为 单个 div 元 素 ，width 属性 用 于 设置 其 宽度 ，height 属性 用 于 设置 其 高 度 ， 和 用 像素 
(px) 作为 固定 尺寸 的 单位 。XHTML 元 素 中 设置 样式 的 默认 单位 为 像素 。 

当 单 位 为 百分比 时 ，div 元 素 的 宽度 和 高 度 为 目 适 应 状态 ， 即 宽度 禹 度 适应 浏览 堪 窗 
口 尺 寸 而 变化 。 

在 前 面 创建 的 div 站 点 文件 夹 内 创建 名 为 divset.html 的 文件 ， 编 写 divset.html 文件 代価 
如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. 
Ww3.org/TR/xhtmll/DTD/xhtmll -transitional.dtd"> 
<html xmins="http://www.w3.org/1999/xhtml"> 


:和 = 二 Web 2.0 标 准 静态 网 页 的 搭建 


<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 设 置 div 样式 </title> 
<style type="text/css"> 
#one { 
background-color: #ccc: 
border:1px solid #000; 
width:200px: 
height:100px: 


} 

#tWO { 
background-color: #ccc; 
border: 1 px solid #000: 
width:3076: 
height:25%; 

} 

</style></head> 

<body> 


<div id="one"> 固 定 div 的 宽度 和 高 度 </div><hr > 
<div id="two'"> 自 适应 div 的 宽度 和 高 度 </div> 
</body> 

</html> 


这 时 候 的 浏览 效果 如 图 2-3 所 示 。 


gS 二 Hicrosoft Tnternet Explorer 
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图 2-3 设置 div 样式 


实例 中 第 1 个 div 宽度 和 高 上 度 国 是， 形成 了 一 个 盒子， 宽度 和 融 度 是 不 可 以 改变 的 。 而 
第 2 个 div 由 于 设置 其 宽度 为 50%， 其 宽度 随 着 浏览 器 宽度 的 变化 而 变化 。 但 是 第 2 个 div 
的 高 度 虽 然 设置 为 25%， 按 理 说 ， 其 高 度 应 该 随 着 浏览 器 高 度 的 变化 而 变化 。 然 而 在 实例 中 
div 高 度 仅 和 文本 高 度 相 当 ， 好 像 高 度 设 置 没 有 起 作用 。 这 是 因为 设置 高 度 目 适 应 有 一 个 前 
提 , div 的 高度 自 造 皮 赴 相対 干 父 容器 的 高度 , 実例 中 div 父 容 器 为 body 或 者 xhtml。body 
或 者 xhtml 在 本 例 中 没有 设置 高 度 ，div 的 高 度 上 日 适应 没有 参照 物 ， 也 束 无 法 生效 。 
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接 下 来 ， 在 CSS 中 为 body 和 xhtml 设置 高 度 ， 就 可 解决 div 的 高 度 自 适应 问题 了 。 将 
body 和 HTML 的 高 度 直接 设置 为 100% 即 可 ， 不 会 对 页 面 有 任何 影响 。 在 编码 中 的 CSS 部 
分 加 入 如 下 代码 : 


xhtml,body{height:100%;} 


为 了 考虑 多 种 浏览 器 的 兼容 性 ， 将 xhtml 和 body 同时 设置 为 100% 宽 度 。 浏 览 器 的 浏览 
效果 如 图 2-4 所 示 。 


庆 设置 di 样式 二 icrosoft Tnmtermet Explorer 
， 交 件 中 编辑 开 ) 查看 各 收藏 由 工具 民 ) 各 助人 0 


| a ”Ws 回 加 n の 搜索 3 て 收藏 可 を 


: 地 址 局] | 食 http: wilocalhost/diveet. htm1 


所 J 素地 Intranet 


图 2-4 为 div 标签 设置 高 度 适 应 后 的 效果 


调整 浏览 器 高 度 后 ， 第 2 个 div 的 高 度 随 之 变化 。 各 种 浏览 器 对 XHTML 和 CSS 的 解析 
方式 有 差异 ， 在 后 面 的 章节 中 将 详细 讨论 解决 浏览 器 兼容 性 问题 的 解决 办 法 。 


由 于 网 页 访问 者 的 电脑 显示 分 辨 率 各 不 相同 ， 第 见 的 显示 分 辨 率 〈 单 位 : 像素 ) 
为 800x600、1024x768、1280x1024 等 。 所 以 在 布局 页 面 时 ， 要 充分 考虑 到 页 面 内 容 
的 布局 宽度 ， 一 旦 内 容 宽度 超过 显示 宽度 ， 页 面 将 出 现 水 平 滩 动 条 。 对 于 页 面 的 高 
度 ， 一 般 由 页 面 内 容 决 定 。 网 页 布局 应 符合 浏览 者 的 习惯 ， 应 尽量 保证 网 页 只 有 垂直 
滚动 条 。 

页 面 布 局 宽度 一 般 考 虑 最 小 显示 分 辩 率 的 浏览 用 户 ， 近 些 年 的 显示 器 的 显示 分 辨 率 最 
小 为 800x600 (15 寸 CRT 显示 器 )， 其 最 小 宽度 为 800 像 系 。 浏 览 器 的 边框 及 滚动 条 部 分 
约 占 24 像素 左右 ， 所 以 布局 宽度 为 分 辨 率 的 水 平 像素 减 去 24 像素 。 所 以 过 去 网 页 布局 宽 
度 一 般 六 778 像素 ， 再 宽 就 会 使 页 面 产 生 水 平 深 动 条 。 由 于 计算 机 设备 的 飞速 发 展 ， 现 在 
使用 800x600 显示 分 辩 率 的 用 户 已 经 很 少 了 ， 现 在 页 面 布局 宽度 最 大 不 超过 1002 一 1003 
像素 (考虑 到 最 小 宽度 1024 像素 ， 即 1024x768 显示 分 辩 率 )。 网 页 的 宽度 设计 效果 ， 如 
2-5 所 示 。 
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定义 宽 为 778 或 者 1002 像素 
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图 2-5 网 页 的 宽度 设计 


oi 水 平 居 中 显示 J 


制作 网 页 时 ， 通 第 需要 将 整个 网 页 的 内 容 在 浏览 喜 中 居中 显示 ， 使 用 XHTML 表格 布局 
页 面 时 ， 只 需 将 布局 表格 的 align 属性 设置 为 center 即 可 。 而 div 居中 没有 属性 可 以 设置 ， 只 
能 通过 CSS 控制 其 位 置 。 在 布局 页 面前 ， 网 页 设计 者 一 定 要 把 页 面 的 默认 边 距 清除 。 为 了 
方便 操作 ， 常 用 的 方法 是 将 所 有 对 象 的 边 距 清 除 ， 即 设置 margin 属性 和 padding 属性 。 
margin 属性 代表 对 象 的 外 边 距 〈 上 、 下 、 左 、 右 )，padding 属性 代表 対象 的 内 辺 嘘 , 也 叫 填 
充 (上 、 ト 、 左 、 右 )。 marsin 属性 和 padding 属性 类 似 于 表格 单元 格 的 cellspacing 属性 和 
cellpadding 属性 ， 不 过 margin 属性 和 padding 属性 作用 于 所 有 块 状元 到 。 

使 div 元 素 水 平 大 中 的 方法 有 多 种 ， 和 常用 的 方法 是 用 CSS 设置 div 的 左右 边 距 ， 即 
margin-left 属性 和 margin-right 属性 。 当 设置 div 左 外 边 距 和 右 外 边 距 的 值 为 auto， 即 自动 
时 ， 左 外 边 距 和 右 外 边 距 将 相等 ， 即 达到 了 div 水 平 居 中 的 效果 。 

在 站 点 dv 目录 下 创建 网 页 XHTML 1.0 文件 ， 命 名 为 divalign.html， 编 写 divalign.html 
文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 水 平 居 中 </title> 

<style type="text/css"> 

xhtml,body {height: 100%;! 


*{margin:Opx; 


padding:Opx: 


} 
#web {width:75%; 
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height: 100%; 
background-color:#ccc; 
border:1px solid #000: 
margin-left:auto: 
margin-right:auto; 

} 
</style> 
</head> 
<body> 
<div id="web"> 这 里 是 整个 网 页 的 内 容 </div> 
</body> 
</html> 


在 浏览 器 地 址 栏 中 输入 http://127.0.0.1/divalign.html， 浏 览 效果 如 图 2-6 所 示 。 


入 水 手 居 中 一 icrosoft Tnternet Ezplorer 
: 立件 ) ”编辑 外 ) ”查看 他) 收藏 入 工具 (I) 妖 助 ⑪) 
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肥 昌 是 本 不 网 页 的 内 容 


图 2-6 设置 水 平 居 中 的 效果 
设置 外 边 距 的 CSS 代码 可 以 进一步 简化 ， 使 用 margin 属性 ， 编 码 如 下 : 


margin:Opx auto; 


说 明 : 
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margin 属性 值 后 面 的 0 代表 上 边 距 和 下 边 距 为 0 像 系 , auto 代表 左边 距 和 右边 距 为 


auto， 即 自动 设置 。 这 里 0px 和 auto 之 间 使 用 空格 符号 分 隔 ， 而 不 是 过 号 。 


2.1.6 _ div 的 其 套 ] 


为 了 实现 复 淋 的 布局 结构 ，div 也 需要 互相 内 僚 。 不 过 在 布局 负面 时 应 尽量 少 欣 套 ， 
为 XHTML 元 素 多 各 欣 人 套 ， 将 影响 浏览 占 对 代码 的 解析 速度 。 在 div 站 点 文 件 夹 中 ， 创 建 


XHTML 1.0 标准 文档 ， 命 名 为 divindiv.html， 编 写 divindiv.html 文件 代码 如 下 : 


:和 = 划 和 Web 2.0 标 准 静 态 网 页 的 搭建 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtmll/DTD/xhtmll -transitional.dtd"> 
< く html xmlns="http://www.w3.org/1999/xhtml"> 


<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> ©) 

<title>div 和 骨 食 </title> 

<style type="text/css"> 

*#{margln:OpX; 

padding:Opx: 
} 

#web {width:778px; 
height:500px: 
background-color:#Ccc: 
margin:Opx auto: 

} 

#banner{width:300px: 
height:250px: 
background-color:#cee: 
border:1px solid #000: 
margin:Opx auto; 

} 

#foot{ width:500px; 
height:250px: 
background-color:#cee: 
border: 1px solid #000: 
margin:Opx auto; 

} 

</style></head> 

<body> 

<div 1d="web"> 

<div 1d="banner">banner</div> 
<div 1d="foot">foot</div> 
</div> 

</body> 

</html> 


本 实例 综合 了 居中 的 知识 ， 内 部 的 2 个 div 水 平 居中 在 其 父 容器 (外 部 div) 中。 在 浏 
览 器 地 址 栏 中 输入 http:/127.0.0.1/divindiv.html， 浏 览 效 果 如 图 2-7 所 示 。 


div 的 泽 动 - 


通过 div 布局 网 页 ， 结 果 是 一 个 div 标签 占据 一 行 ， 怎 样 才能 够 实现 布局 中 并 列 的 2 块 
区 域 叫 ? 块 状元 素 有 一 个 很 重要 的 “float” 属 性 ， 可 以 使 多 个 块 状 元 素 并 列 于 一 行 。float 属 
性 也 被 称 为 浮动 属性 ， 对 前 面 的 div 元 素 设 置 浮动 属性 后 ， 当 前 面 的 div 元 素 留 有 足够 的 罕 
白 宽 度 时 ， 后 面 的 div 元素 閣 自 効 浮上 来 , 和 前 面 的 div 元 素 并 列 于 一 行 。float 属性 的 值 为 


left、right、none 和 inherit。 
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图 2-7 div 髓 套 效 果 
@ float 属性 值 为 inherit 时 ， 这 是 继承 属性 ， 代 表 继 承 父 容器 的 属性 ; 
@ float 属性 值 为 none 时 ， 块 状元 素 不 会 浮动 ， 这 也 是 块 状元 素 的 默认 值 ; 
@ float 属性 值 为 left 时 ， 块 状元 素 将 向 左 浮动 ; 
@ float 属性 值 为 right 时 ， 块 状元 素 将 向 右 浮动 。 
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在 使 用 的 时 候 要 使 两 个 div 并 列 于 一 行 的 前 提 是 ， 这 一 行 有 足够 的 宽度 容纳 两 个 div 的 


宽度 。 下 面 我 们 以 实例 的 形式 讲解 div 的 浮动 设置 ， 有 基体 步骤 如 下 : 
打开 Dreamweaver CS5， 创 建站 点 div， 站 点 的 属性 设置 如 图 2-8 所 示 。 


靖 点 误 置 对 兽 divw 


Drearrweawer 站 点 是 隅 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Crearmweaver 
帳 点 通常 包 信 同和 電 部分: 可 在 其 中 和 存 情 和 处理 奖 件 的 计算 机 上 的 本 地 奖 件 
卖 ， 以 名 可 在 其 中 将 相同 区 件 支 布 到 Wweb 上 的 服务 器 上 的 远程 芝 件 夹 。 


您 可 以 在 此 处 当 Dreamweawer 站 点 选择 未 地 辫 件 夹 和 略称 。 
站 点 名 称 ， 
素 地 站 点 立 件 垃 ; 一 


图 2-8 定义 div 站 所 
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创建 后 ， 新 建立 一 个 网 页 文件 (XHTML 1.0)， 命 名 为 divfloathtml， 编 写 文 件 
代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. : 
org/TR/xhtml1/DTD/xhtmll-transitional.dtd" テ > 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 设 置 div 浮动 </title> 
<style type="text/css"> 
*{ margin:0px; 
padding:Opx: 
} 
#first{ width: 150px; 
height:100px: 
background-color:#Ccc: 
border:1px solid #000: 
float:left: 
} 
#second{ width: 180px; 
height: 1 00px; 
background-color:#eee; 
border: lpx solid #000; 
} 
</style></head> 
<body> 
<div id="first"> 第 1 个 div</div> 
<div id="second"> 第 2 个 div</div> 
</body> 
</html> 


实例 中 将 两 个 div 设置 为 不 同 的 宽度 和 不 同 的 背景 色 ， 在 浏览 需 地 址 栏 中 输入 
http://127.0.0.1/divfloat.html， 浏 览 效果 如 图 2-9 所 示 。 
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图 2-9 设置 div 左 浮动 的 效果 


只 设置 了 第 1 个 div 元素 向 左 浮 効 , 第 2 个 div 元 素 “ 流 ”上 来 了 ， 并 紧 换 看 


第 1 个 div 元 素 。 接 下 来 设置 第 2 个 div 向 右 浮动 ， 代 人 码 如 下 : 


#second {width:180px; 
height: 1 00px; 
background-color:#eee; 
border:1px solid #000; 
float:right 


) 


在 浏览 器 地 址 栏 中 输入 http:/127.0.0.1/divfloat.html， 浏 览 
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图 2-10 div 左 浮 効 和 右 浮 効 


修改 后 第 2 个 div 紧 挨 着 其 父 容器 〈 浏 览 器 ) 的 右边 框 ， 这 两 个 div 元素 也 可 


以 换个 位 置 ， 即 设置 CSS 代 偶 如 下 : 


*{ margin:0px; 

padding:0px; 
} 

#first{ width: 150px; 
height: 100px; 
background-color:#ccc; 
border:1px solid #000: 
float:right: 

} 

#second {width:180px; 
height:100px: 
background-color:#cee: 
border:1px solid #000; 
float:left 


} 
浏览 器 中 的 浏览 效果 ， 如 图 2-11 所 示 。 
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效果 如 图 2-10 所 示 。 


E ア 候 華 時 Web 2.0 标 准 静 态 网 页 的 搭建 


涌 设 置 div 浮 动 二 icrosoft Internet Explorer 
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图 2-11 交換 div 浮动 方向 


浮动 属性 是 CSS 布局 的 利器 ， 可 以 通过 不 同 的 浮动 属性 值 灵活 地 定位 div 元 素 ， 以 达到 
灵活 布局 网 页 的 目的 。 块 状元 素 〈 包 括 div) 浮动 的 范围 ， 由 其 父 容器 所 决定 ， 本 实例 中 div 
元 素 有 的 父 容器 就 是 body 或 html。 

为 了 更 加 灵活 地 定位 div 元 素 ，CSS 提供 了 clear 属性 。clear 属性 的 值 为 none、left、 
right 和 both， 默 认 值 为 none。 当 多 个 块 状元 系 由 于 第 1 个 元 素 设 置 了 浮动 属性 而 并 列 时 ， 
如 果菜 个 元 率 不 需要 被“ 流 ” 上 去 ， 即 可 设置 相应 的 clear 属性 。 

在 站 点 文件 夹 内 创建 XHTML 1.0 文件 ， 命 名 为 divclearhtm， 编 写 文 件 代 码 
如 下 : 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. 
Ww3.org/TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title>div 的 消除 属性 </title> 

<style type="text/css"> 

*{ margin:0px; 

padding:Opx: 
} 

.web {width:S00px; 
height:100px: 
background-color:#Ccc: 
margin:Opx auto: 
} 

.One,.two,#threel] ,#three2,#three3,#three4 {width: 150px; 
height:30px: 
background-color:#cee: 
border:1px solid #000; 
} 

.one {float:left;} 

.two {float:right;} 

#threel {clear:none;} 


#three2 {clear:right; 
#three3 {clear:left; 
#three4 {clear:both;} 
</style></head> 
<body> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div class="two"> 第 2 个 div</div> 
<div id="three1 "> 第 3 介 div (clear:none;) </div> 
</div> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div class="two"> 第 2 个 div</div> 
<div id="three2"> 第 3 个 div (clear:right;) </div> 
</div> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div id="three3"> 第 3 个 div (clear:left;) </div> 
<div class="two"> 第 2 个 div</div> 
</div> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div id="three4"> 第 3 个 div (clear:both;) </div> 
<div class="two"> 第 2 个 div</div> 
</div> 
</body> 
</html> 


在 TE 浏览 器 地 址 栏 中 输入 http:/127.0.0.1/divclearhtml, 接 《Enter〉 键 ， 浏 


效果 如 图 2-12 所 示 。 
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图 2-12 div 清除 属性 
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:全 = 庆 和 Web 2.0 标 准 静 态 网 页 的 搭建 


通过 前 面 综合 学 习 布局 知识 ， 读 者 已 经 初步 掌握 了 使 用 div+CSS 进行 布局 的 基础 知识 ， 
本 节 将 制作 一 个 典型 的 网 页 布局 实例 。 该 实例 要 求 页 面 有 上 下 4 行 区 域 ， 分 别 用 作 广 告 区 、 
导航 区 、 主 体 区 和 版 权 信 息 区 。 而 主体 区 又 分 为 左右 2 个 大 区 ， 左 区 域 用 于 文章 列表 ， 石 区 
域 用 于 6 个 主体 内 容 区 。 布 局 区 域 比较 多 ， 用 表格 布局 需要 很 多 行 代 人 码 才 能 完成 。 利 用 div 
和 CSS 可 以 很 好 地 完成 ， 并 且 代 人 码 比 较 人 简练 。 

根据 实例 要 求 作 图 ， 并 分 析 布 局 的 结构 ， 从 而 方便 编写 div 布局 的 结构 代码 ， 这 里 做 分 
析 图 ， 如 图 2-13 所 示 ， 并 在 每 个 区 域 做 了 id 命名 (# 符 号 井 共 ), 以 方 便 div 编写 。 
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图 2-13 网 页 布局 结构 分 析 


从 分 析 图 中 可 以 看 清 整 个 页 面 的 结构 ， 其 中 ，#top 代表 广告 区 、 因 av 代表 导航 区 、 
#mid 代表 主体 区 、 圾 eft 代表 #mid 所 包含 的 左 区 域 、 導 ight 代表 #mid 所 包含 的 右辺 区 域 、 
#bottom 代表 版权 信息 区 。 

#right 区 域 包含 6 个 具体 内 容 区 ， 由 于 这 些 内 容 区 的 尺寸 相同 ， 所 以 在 实例 中 将 会 使 用 
class 选择 符 作 为 统一 样式 ， 对 这 6 个 区 域 进行 CSS 样式 指定 。 根 据 结构 分 析 图 编写 
XHTML 部 分 的 结构 代码 如 下 : 


<div id="top">banner 区 域 </div> 
<div id="nav"> 导 航 区 </div> 
<div 1d="mid"> 
<div id="left"> 纵 向 左 导航 区 </div> 
<div 1d="right"> 
<div class="content"> 内 容 A</div> 
<div class="content"> 内 容 B</div> 
<div class="content"> 内 容 C</div> 
<div class="content"> 内 容 D</div> 
<div class="content"> 内 容 E</div> 


<div class="content"> 内 容 F</div> 
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</div> 
</div> 
<div id="bottom"> 底 部 版 权 区 </div> 


这 里 在 6 个 具体 内 容 区 域 ， 用 了 同一 个 class 名 称 的 选择 符 ， 用 于 在 CSS 中 指定 统一 的 样 
式 。 在 Di:\web\ 目 录 下 创建 网 页 文件 XHTML 1.0)， 命 名 为 div page.htm， 编 号 dv page.htm 文 
件 代 码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 网 页 布局 实例 <title> 
<style type="text/css"> 
"1 
margin:O0px; 
padding:Opx: 
} 
#top,#nav,#mid,#bottom { 
width:778px; 
margin:Opx auto; + 
#tOD 1 
height:SOpx: 
background-color:#00FFO0:! 
#nav{ 
height:30px: 
background-color:#3333FF:\ 
#md { 
height:350px:! 
#left{ 
width:194px: 
height:350px: 
border: 1px solid #999: 
float:left: 
background-color:#FF3333;} 
#right{ 
height:350px: 
background-color#CCCCO00:) 
.COntent1 
width:191px: 
height:174px: 
background-color:#FFEFFO0: 
border:lpx solid #999: 
float:left; 
#content2 1background-color#FFOOFE:!\ 
#bottom{ height:80px; 
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background-color:#00FFFF:) 
</style> 
</head> 
<body> 
<div id="top">banner 区 域 </div> 
<div id="nav"> 导 航 区 </div> 
<div 1d="mid"> 
<div id="left"> 纵 问 导 航 区 </div> 
<div 1d="right"> 
<div class="content"> 内 容 A</div> 
<div class="content" id="content2"> 内 容 B</div> 
<div class="content"> 内 容 C</div> 
<div class="content" id="content2"> 内 容 D</div> 
<div class="content"> 内 容 E</div> 
<div class="content" id="content2"> 内 容 F</div> 
</div> 
</div> 
<div id="bottom"> 底 部 版 权 区 </div> 
</body> 
</html> 


这 里 稍微 修改 了 XHTML 部 分 的 代码 ， 选 择 了 4 个 具体 内 容 区 域 ， 加 上 了 id 名 称 为 content2 
的 属性 ， 这 是 为 了 使 这 4 个 区 域 有 不 同 的 背景 色 。 在 浏览 右 地 址 栏 中 输入 http:/localhost/ 
div_page.htm， 浏 时 效果 如 图 2-13 所 示 。 

本 例 综合 了 前 面 的 布局 知识 ， 如 居中 等 。 由 CSS 代码 可 得 ， 主 体内 容 区 (id 名 称 为 mid) 
的 宽度 是 778 像 奈 , 高度 古 350 像素 。 

主体 内 容 区 (id 名 称 为 mid) 的 宽度 与 高 度 为 什么 会 与 内 侣 的 div 冤 度 有 依 天 呢 ? 这 涉 
及 浏览 喜 解 机 CSS 时 对 宽度 和 高 度 的 计算 方法 ， 正 7.0 及 以 上 版 本 的 浏览 右 和 FireFox 浏览 
器 ， 解 析 div 的 客 上 度 和 蜗 度 设置 值 并 不 包括 边框 。 由 CSS 代码 可 得 ， 纵 问 导 航 区 《id 名 称 为 
left) 和 具体 内 容 区 (class 名 称 为 content) 的 边框 宽度 2 ] a 

宽度 和 高 度 的 计算 是 合理 布局 页 面 的 基 
偶 ， 一 旦 计算 有 误 将 导致 页 面 布 局 混乱 。 并 
且 针 对 不 同 浏 览 右 有 不 同 计算 方法 ， 本 书 实 
例 使 用 正 6.0 浏览 器 ， 后 面 草 节 中 将 介绍 不 
同 浏 览 器 莱 容 性 的 解决 办 法 。 


注意 : 

在 宽度 和 高 度 的 计算 中 ，IE 6.0 以前 
版 本 的 浏览 器 ， 解 析 div 的 宽度 和 高 度 设 
置 值 包 括 边 框 ， 如 果 读 者 使 用 的 是 TE 6.0 
以 前 版 本 的 浏览 器 ， 可 以 尝试 修改 宽度 
值 ， 以 达到 图 2-14 的 效果 。 


马 网 页 布局 充 人 网 - Hicrorstt Internet Krploror EE 
ET 和 
Or OO MAO Phim oS る © るる 


tip HET SS も ver hai On NN = Gm or 


2-14 网 页 布局 实例 


一 
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EEZ 列表 元素 布 局 


介绍 完 div+CSS 的 网 页 整体 结构 布局 后 ， 还 需要 治 握 列表 元 取 的 使 用 方法 。Web 2.0 标 
准 的 XHTML 一 个 很 重要 的 原则 就 是 ， 使 用 合适 的 标签 组 成 页 面 结构 。 合 适 的 标签 指标 签 有 
语义 ， 并 且 条 理 清晰 ， 可 谈 性 好 。 所 以 ， 页 面 大 块 区 域 的 布局 一 般 使 用 div 元 系 ， 但 在 东 些 
区 域 (如 导航 条 ) 可 以 考虑 使 用 其 他 元 素 ， 如 使 用 比较 广泛 的 列表 元 又 。 


ンク 列表 元 素 制作 导航 条 


在 传统 的 HTML 页 面 制作 中 ， 列 表 元 素 使 用 并 个 多 ， 而 在 CSS 的 帮助 下 ， 列 表 元 又 


变 得 空前 强大 ， 其 至 应 用 于 小 区 域 布局 。 列 表 元 素 的 ji 是 块 状元 票 ， 所 以 有 宽度 和 局 度 
设置 ， 并 且 可 以 通过 浮动 属性 的 设置 使 多 个 li 元 系 并 排 。 这 种 结构 非常 适合 网 页 的 导航 
条 布局 。 

由 于 在 页 面 布局 时 列表 元 素 不 需要 编号， 所 以 列表 元 了 林 更 多 使 用 ml 标签 。 

在 D:vweb\ 目 录 下 创建 网 页 文件 (XHTML1.0)， 命 名 为 nav ul.htm， 编 写 nav ul.htm 文 
件 代 码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 导 航 条 制作 </title> 

<style type="text/css"> 


*{ margin:0px; 
padding:OpX;} 
#naV 1 
width:500px: 
height:20px: 
margin:Opx auto: 
backgeround-color#FF9900:) 
li{ width:123px: 
height:20px: 
border:1px solid #0000FF: 
text-aliegn:center: 
float:left:) 
</style> 
</head> 
<body> 
<ul id="nav"> 
<]i> 首 页 </i> 
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<]i> 新 闻 </ > 
<1i> 联 系 我 们 </Ii> 
<] 谊 留言 板 </li> 
</ul> 

</body> 

</html> 


为 了 更 方便 看 到 导航 条 的 表现 ， 在 这 里 ， 笔 者 将 ul 设置 成 桶 黄色 背景 色 ， 并 将 Hi 设置 成 
蓝 色 边框 ， 在 浏览 器 地 址 栏 中 输入 http:Vlocalhostnav ulLhtm， 浏 览 效 果 如 图 2-15 所 示 。 


入 导航 条 制作 一 Nicrosoft Internet Explorer 
文件 ば ) 编辑 让) 查看 名 ”收藏 全) 工具 民 ) 大助 加 ) 


2 2 -国名 有 并 病人 @ 
地 址 @) | 参 ]n: \ 線 寺 仙 的 di 列表 元素 布 局 \nav_ul. html | 回 特色 链接 ”入 SnagIt 還 


图 2-15 ”导航 条 布局 


导航 条 的 制作 


在 实际 操作 中 ， 为 了 增加 导航 条 的 互动 ， 列 表 元 到 沿 常 配合 超 链 接 元 素 一 起 使 用 。 超 链 
接 有 伪 类 选择 从 ， 可 以 呈现 链接 文学 和 用 户 互 动 的 4 个 状态 ， 即 未 访问 前 、 忌 标清 过 、 鼠 标 
单 击 时 和 被 访问 后 。 其 实 Web 2.0 标准 中 ， 不 WA li 等 其他 元素 同 
样 有 :hover 和 :active 这 两 个 伪 类 选择 符 ， 只 是 正 浏览 器 只 文 持 超 链接 元 又 的 伪 关 选择 符 。 为 
了 兼容 正 浏览 右 ， 只 得 配合 超 链 接 制 作 互动 导航 条 。 

说 明 : 

FireFox 浏览 器 比 正 浏 览 器 更 接近 Web 标准 的 代码 解析 ， 所 以 FireFox 浏览 器 支持 其 
元 素 的 伪 类 选择 符 


虽然 超 链接 元 素 是 内 联 元 素 ， 但 在 本 例 中 ， 这 里 用 CSS 代码 将 其 转换 为 块 状元 素 ， 然 
后 设置 其 党 度 和 高 上 度 。 这 样 束 不 需要 设置 li 元素 的 样式 了 ， 只 要 设置 fi 元素 的 浮动 属性 ， 束 
可 以 使 fi 元素 并 列 捍 放 。 在 Dweb\ 目 录 下 创建 网 页 文件 (XHTML1.0)， 命 名 为 
nav ul a.htm， 编 写 nav ul a.htm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 导 航 条 制作 </title> 

<style type="text/css"> 


2 


*{margin:OpxX; 
padding:OpX;} 
ulilist-style:none;} 
#nav{width:500px; 
height:20px: 
margin:Opx auto: 
background-color:#FF9900:) 
li{float:left;} 
li aidisplay:block: 
width:117px: 
height:20px: 
border:1px solid #0000FF: 
margin-left:Spx; 
font-weight:bold; 
text-decoration:none: 
text-align:center: } 
li a:link{ 
background-color:#990000; 
color:#9900FF;} 
li a:hover{background-color:#00CCO0; 
color:#FFFFOO;} 
li aactive1background-color#FFO0000:) 
li a:visited {background-color:#00FFO0O0;} 
</style> 
</head> 
<body> 
<ul id="nav"> 
マロ > 
<a href="#" title=" 这 是 网 站 上 页 "> 首页 </a> 
マル > 
マロ > 
<a href="#" title=" 这 是 新 闻 的 链接 "> 新 闻 </a> 
マル > 
< ロン 
<a href="#" title=" 这 是 沟通 的 渠道 "> 联系 我 们 </a> 
マル > 


<li> 
<a hre 人 ="#" title=" 这 是 留言 的 链接 "> 留言 板 </a> 
</li> 
</ul> 
</body> 
</html> 
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为 了 更 方便 看 到 导航 条 的 表现 ， 这 里 将 ul 设置 为 杰 色 背景 色 ， 并 将 超 链接 元 系 设 置 为 


蓝 色 边框 。 在 不 同 状态 下 ， 超 链接 以 及 内 售 文 本 有 不 同 凑 色 。 在 浏 
http://1ocalhostnav ul ahtm， 浏 览 效 果 如 图 2-16 所 示 。 


a 
リリ 


策 地 址 芒 中 输入 
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汉 制作 导航 条 一 Nicroso ft Internet Explorer 
文件 严 ) 编辑 于) ”查看 他” 收藏 好) 工具 并) 帮助 出) 
Om © 回 回 8 の mm の 括 - ほ き G・ る 3 


地 址 句 ) http: fflocalhost/navy ul a.htm マ 民 】 苇 到 链接 や © SnagIt 皿 
= i ED = Hb 


自 山 


钨 | file: /iD:/ 绕 习 做 的 diwi 到 表 元 素 布 局 /nav_ul_a. html# 


图 2-16 制作 互动 导航 条 


导航 条 的 互动 布局 


该 者 可 能 有 疑惑 ， 既 然 超 链接 转换 为 块 状元 素 了 了， 为 什么 4 个 超 链 接 区 域 块 可 以 并 列 于 
一 行 呢 ?这 是 因为 虽然 超 链接 块 没 有 设置 浮动 属性 ， 但 其 直属 的 父 容器 ， 即 li 元 素 设 置 了 学 
动 属性 ， 所 以 实际 是 4 个 li 元素 并 列 。 通 过 引入 超 链 接 的 伪 类 选择 符 ， 导 航 条 有 了 互动 性 。 
根据 用 户 不 同 的 操作 ， 超 链接 可 呈现 出 不 同 的 样式 ， 如 背景 色 的 改变 和 文本 颜色 的 改变 。 为 
了 使 超 链 接 的 文本 更 突出 ， 本 例 使 用 了 font-weight 属性 ， 设 置 其 值 为 bold， 即 使 文本 加 粗 。 
通过 将 text-decoration 属性 设置 为 none， 去 除了 超 链接 默认 的 下 划 线 。 

为 了 导航 条 各 子 项 不 至 于 过 于 拥挤 ， 本 例 中 使 用 了 margin-left 属性 , 即 左辺 距 , 使 毎 人 
超 链接 块 都 有 5 像素 的 左边 距 。 考 虑 到 边 距 、 超 链接 块 的 宽度 和 边框 粗细 ，ul 元 素 宽 度 设 置 
为 425 像素 ， 即 图 2-16 中 的 黄色 部 分 。 


注意 : 
通常 网 页 设计 中 很 少 使 用 ul 元 素 的 列表 符号 ， 所 以 把 ul 标签 选择 符 的 ist-style 属性 设 
置 为 none， 表 示 页 面 中 任何 Ul 列表 结构 都 没有 列表 符号 。 


Section | 


CSS 盒 模型 


CSS 盒 模型 ， 对 于 使 用 div+CSS 布局 的 方法 来 说 是 非常 重要 的 概念 ， 因 为 盒 模型 是 CSS 
定位 布局 的 核心 内 容 。 读 者 学 习 了 布局 网 页 的 基本 方法 ， 只 需 利 用 div 元 素 和 列表 元 素 ， 即 
可 完成 页 面 大 部 分 的 布局 工作 。 但 是 前 面 学 习 的 知识 更 注重 实践 操作 ， 读 者 并 不 理解 布局 的 
原理 ， 常 常 在 布局 页 面 的 过 程 中 ， 会 遇 到 无 法 理解 的 问题 。 学 习 完 本 节 的 盒 模型 的 知识 后 ， 
读者 将 拥有 较 完 善 的 布局 观 ， 基 本 可 做 到 使 用 代码 完成 div+CSS 的 布局 操作 。 


于 Css 含 模型 的 概念 


XHTML 中 的 大 部 分 元 又 《特别 是 块 状元 素 )， 六 可 以 看 作 是 一 个 合子， 而 网 页 元 素 的 
定位 ， 实 际 束 是 这 芋 大 大 小 小 的 盒子 在 页 和 面 中 的 定位 。 当 茶 个 块 状元 素 被 CSS 设置 了 浮动 
属性 ， 这 个 盒子 贺 会 日 动 的 排 到 上 一 行 。 网 页 布局 即 关 注 这 坚 盒 子 在 页 面 中 如 何 摆 放 、 如 何 
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骨 套 的 问题 ， 而 这 么 多 盒子 摆 在 一 起 ， 最 需要 关注 的 是 盒子 太 寸 计算 和 是 否 流动 等 要 素 。 为 
什么 要 把 XHTML 元 素 作 为 盒 模型 来 研究 呢 ? 因 为 XHTML 元 率 的 特性 和 一 人 信子 非 常 相 
似 ， 盒 子 里 面 的 内 容 到 盒子 的 边框 之 间 的 距离 即 填 充 (padding ); 盒子 本 身 有 边框 
(border); 例子 边框 外 和 其 他 盒子 之 间 有 边界 margin)， 盒 模型 示意 图 如 图 2-17 所 示 。 

大 多数 XHTML 元 素 的 结构 都 类 似 于 图 2-17 所 示 ， 除 了 包含 的 内 容 (文本 或 图 片 ) 
外 ， 还 有 内 边 距 、 边 框 和 外 边 距 一 层 层 的 包 圳 。 读 者 在 布局 网 页 和 定位 XHTML 元 素 时 要 充 
分 若 碟 到 这 些 要 系 ， 才 可 以 更 加 目 如 地 摆 放 这 些 例子 。 


| margin ( 外 边 距 ) 


内 容 


< ps 


\padding ( 内 边 距 ) 


い 
» 
As BE 


人 border (边框 ) 


图 2-17 使 模 型 示意 图 


外 边 距 属性 即 CSS 的 margin 属性 , CSS 中 可 拆 分 为 margin-top (頂部 外 辺 距 )、margin- 
bottom (的 部 外 边 距 )、margin-left( 左 边 外 边 距 ) 和 margin-right (右辺 外 辺 距 )。CSS 的 边 
框 属性 (border) 和 内 辺 距 属性 て padding) 同样 可 拆 分 为 4 边 。 在 Web 2.0 标准 中 ，CSS 的 
width 属性 即 为 盒子 所 包含 内 容 的 宽度 ， 而 整个 盒子 的 实际 宽度 即 为 : 

盒子 宽度 - 

padding-left+border-left+margin-left+width+padding-right+border- right+margin-right 

相应 地 ，CSS 的 height 属性 即 为 盒子 所 包 仿 内容 的 高 度 ， 而 整个 盒子 的 实际 融 度 即 为 : 

盒子 高 度 - 
margin-top+border-top+padding-top+height+padding-bottom+border-bottom+margin-bottom 

全 模型 在 使 用 的 过 程 中 ， 还 要 注意 以 下 几 扣 : 

(1) 边界 值 可 为 负 值 ， 但 随 着 浏览 器 的 不 同 显示 可 能 会 不 一 样 ; 

(2) 填充 值 不 可 以 为 负 值 ; 

(3) 对 于 块 级 元 素 ， 未 浮动 的 垂直 相 邻 元 对 的 上 边界 和 下 边界 会 被 压缩 。 

(4) 对 于 浮动 元 么 ， 边 界 不 压 给， 且 符 浮动 元 素 不 声明 宽度 ， 则 其 宽度 趋同 于 0。 

(5) 如 条 全 中 没有 任何 内 容 ， 不 管 宽 度 和 高 度 设 置信 为 多 少 ， 都 不 会 被 显示 。 


外 边 距 的 控制 


在 CSS 中 , margin 属性 可 以 统一 设置 ， 也 可 以 上 下 左右 分 开设 置 。 在 D:\web\ 目 录 下 创 
建 网 页 文件 (XHTML1.0)， 命 名 为 box_margin.htm， 编 写 box margin.htm 文件 代码 如 下 : 


ーー 
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<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transittonal/EN" "http://www.w3. 
org/TR/xhtmll/DTD/xhtmll -transitional.dtd"> 
< く html xmlns="http://www.w3.org/1999/xhtml"> 


く head> 」 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> > 
<title> 外 边 距 设置 </title> 
<style type="text/css"> 
*{ margin: Opx;} 
#all{ width:600px; 
height:500px: 
margin:Opx auto; 
background-color:#FF9900:! 
#a,#b,#c,#d,#e{ 
width:200px; 
height:100px: 
text-aliegn:center: 
hne-height:100px: 
background-color#FFFFO00:) 
#a1margin-left:10px: 
margin-bottom:25px:! 
#b {margin-left:Spx; 
margin-right: 10px; 
margin-top: I lpx; 
float:left 
} 
#c {margin-bottom: 1 Opx;} 
#e{margin-left: 10px; 
margin-top:20px:! 


く /style> 

</head> 

<body> 
<div 1d="all"> 
<div id="a">a 盒子 </div> 
<div id="b">b 盒子 </div> 
<div id="c">c 盒子 </div> 
<div id="d">d 盒子 </div> 
<div id="e">e 盒子 </div> 
</div> 

</body> 

</html> 


为 了 更 方便 地 看 到 div 的 表现 ， 这 里 将 外 部 div 设置 为 枯黄 色 背 景色 ， 并 将 内 部 div 设置 

为 黄 背 景色 。 在 浏览 器 地 址 栏 中 输入 http://localhost/box margin.htm， 浏 览 效果 如 图 2-18 所 

示 。 这 个 实例 非常 典型 ， 特 别 是 b 盒子 、c 信子 和 d 盒子 之 间 的 关系 ， 具 体 关 系 图 如 图 2-19 
所 示 。 
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图 2-18 外边 距 设 置 图 2-19 外 边 距 关系 图 


由 于 b 盒子 设 置 了 回 左 浮动 ， 所 以 党 随 其 后 的 c 盒子 日 然 移 上 来 ， 和 b 盒子 并 列 在 同一 
行 ， 如 图 2-19 所 示 ，b 盒子 的 高 度 为 : 

heightHmargin-top=111 ( 像 素 ) 

heightHmargin-bottom=110 ( 像 素 ) 

由 此 可 见 ， 在 这 一 行 中 c 盒子 下 面 留 有 1 像 素 的 空隙 , d 盒子 正 是 利用 这 1 像 素 的 空 同 

“法” 上 来 ， 所 以 b 盒子 、c 盒子 和 d 盒子 存在 于 同一 行 上 。 

说 明 : 

当然 ， 读 者 可 以 尝试 把 b 盒子 的 顶部 边 距 设置 为 10 像素 ， 这 时 b 盒子 和 c 金子 高度 一 
致 。 此 时 ，d 盒子 无 法 “ 流 ” 上 来 ，d 盒子 将 自动 换行 ， 位 于 bb 盒子 下 面 。 


边框 (border) 作为 使 模型 的 组 成 部 分 之 一 ， 其 样式 非常 受 重 视 。 边 框 的 CSS 样式 设 
置 ， 不 但 影响 到 盒子 的 尺寸 ， 还 影 啊 到 盒子 的 外 观 。 边 框 (border) 的 属性 值 有 三 种 ， 边 框 
尺寸 ( 像 系 )、 边 框 类 型 和 边框 闫 色 (十 六 进 制 )。 在 Di\wweb\ 目 录 下 创建 网 页 文件 
(XHTML1.0)， 命 名 为 box_border.htm， 编 瑟 box borderhtm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 边 框 样式 设置 </title> 

<style type="text/css"> 

*{margin:0px;} 

#all{ width:490px: 
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height:400px: 
margin:Opx auto; 
background-color#FF9900:) 


#a,#b,#c,#d,#e,#f,#g{ width:180px: 「 
height:70px: > 
text-align:center; 
line-height:60px; 
background-color#99FFO0:) 

#a1 width:400px: 

margin: 7px; 


border: lpx solid #000000:) 

#b{ border:30px solid #996600: 
float:left;} 

#c{ margin-left:6px; 
border:30px groove #0099FF;t 

#d{ margin-left:6px; 
border:2px dashed #000000: 
float:left:) 

#e{ margn-left:6px: 
border:2px dotted #000000; 
float:left:) 

#f{ margin:6px; 
border-left:2px solid #0000FF: 
border-top:2px solid #0000FF: 
border-right:2px solid #CC3300: 
border-bottom:2px solid # が CC3300: 
float:left;} 

#g{ margim-tOD:6DX: 
border-top:2pX groove #999999;} 


</style> 
</head> 
<body> 
<div 1d="all"> 
<div id="a">a 盒子 </div> 
<div id="b">b 盒子 (solid 类 型 )</div> 
<div id="c">c 盒子 (groove 类 型 )</div> 
<div id="d">d 盒子 (dashed 类 型 ) </div> 
<div id="e">e 盒子 〈dotted 类 型 ) </div> 
<div id="f'>f 盒子 </div> 
<div id="g">g 盒子 </div> 
</div> 
</body> 
</html> 


为 了 更 方便 地 看 到 div 的 表现 ， 这 里 将 外 部 div 设置 为 本 F9900 背景 色 ， 并 将 内 部 
div 设置 为 #99FF00 背景 色 。 在 浏览 器 地 址 栏 中 输入 http://localhost/box_border.htm， 浏 览 
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效果 如 图 2-20 所 示 。 
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2-20 边框 样式 设置 


这 个 实例 使 XHTML 对 象 看 起 来 更 像 是 个 盒子 了 ， 边 框 只 是 盒子 包装 中 的 一 层 ， 最 外 层 
的 包 涛 是 不 可 见 的 外 边 距 。 边 框 的 宫 度 计算 非常 重要 ， 读 者 定位 元 素 要 充分 考虑 边框 宽度 ， 
如 图 2-20 所 示 ， 边 框 的 第 用 设 萤 方法 为 : 

border: 宽 度 类 型 顔色 : 

这 是 4 条 边框 统一 设置 的 方法 ， 如 果 要 分 别 设置 4 条 边框 ， 则 将 border 改 为 border- 
top 《顶部 边框 )、border-bottom (的 部 边框 )、border-left( 左 边框 ) 和 border-right (右边 
框 )。 将 “类型 ”修改 成 不 同样 陈 的 边框 线条 ， 第 用 的 有 solid( 实 线 )、dashed (虚线 )、 
dotted (点 状 线 )、groove (立体 线 )、double〔( 双 线 )、outset( 浮 有 雕 线 ) 等 ， 谈 者 可 以 逐个 


尝试 。 


内 边 距 的 设置 : 


内 辺 距 (padding) 类 似 于 HTML 中 表格 单元 格 的 填充 属性 ， 即 盒子 边框 和 内 容 之 
间 的 距离 。 内 边 距 (padding) 和 外 辺 距 (margin) 很 相似 ， 都 是 不 可 见 的 盒子 的 组 成 部 
分 ， 只 不 过 内 边 距 (padding) 和 外 边 距 (margin) 之 间 夹 着 边框 。 在 D:\web\ 目 录 下 创 
建 网 页 文件 (XHTML 1.0)， 命 名 为 box padding.htm， 编 瑟 box padding.htm 文件 代価 
如 下 : 
<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 


org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
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<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 内 边 距 的 设置 </title> 


<style type="text/css"> 
*{ margin:Opx;} ©) 
#all{width:460px; 
height:400px; 
margin:Opx auto; 
padding:30px: 
background-color:#FF9900:) 
#a,#b,#c,#d,#e,#f,#g{width:200px; 
height:80px; 
border: lpx solid #0000FF: 
background-color:#00FFO0;} 
piwidth:100px: 
height:50px: 
paddine-top:20px: 
backgeround-color#CC99CC:! 
#a1padding-left:70px:! 
#b 1padding-top:60px:! 
#c1padding-right:S0px:! 
#d}padding-bottom:40px:! 
</style> 
</head> 
<body> 
<div 1d="all"> 
<div 1d="a"> 
<p>a 盒子 </p> 
</div> 
<div 1d="b"> 
<p>b 盒子 </p> 
</div> 
<div 1d="c"> 
<p>c 盒子 </p> 


</div> 
<div 1d="d"> 
<p>d 盒子 </p> 
</div> 

</div> 

</body> 

</html> 


为 了 更 方便 地 看 到 div 的 展现 ， 这 里 将 外 部 div 设置 为 杆 F9900 背景 色 ， 并 将 内 部 div 设 
置 为 #00FF00 背景 色 ， 而 将 p 元 素 设 置 为 #CC99CC 背景 色 。 在 浏览 器 地 址 栏 中 输入 
http://localhost/box padding.htm， 浏 览 效 果 如 图 2-21 所 示 。 


ジン 
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图 2-21 内 边 距 的 设置 


盒 模型 兼容 问题 


微软 浏览 器 TE 6.0 以 后 的 版 本 ， 内 藤 了 两 种 表现 模式 : 标准 模式 和 鳞 容 模式 。 在 标准 
ee 页 面 以 TE 5.0， 其 至 
IE 4.0 显示 页 面 的 方式 来 显示 ， 使 以 前 的 网 页 也 能 正常 显示 。 这 两 种 模式 最 大 的 问题 束 是 
盒 模式 的 兼容 问题 ， 但 是 ， 正 在 兼容 模式 下 ， RE 天 在 最 新 版 本 的 HE 7.0 中 保 
留 着 ， 一 旦 页 面 使 用 兼容 模式 浏览 ， 了 下 7.0 将 变 成 跟 TE 5.0 一 样 不 兼容 Web 标准 。 

i 如 Opera 浏览 器 、FireFox 浏览 

。 使 用 浏览 器 不 同 的 模式 通过 不 同 的 DTD (文档 类 型 声明 ) 来 实现 ， 在 早期 的 HTML 
= HTML 声明 部 分 直接 使 用 如 下 形式 : 


く html>. . <7html> 


这 样 的 页 面 在 浏览 旨 中 浏览 时 会 使 用 若 容 模式 ， 如 末 HTML 页 面 使 用 如 下 DTD 声明 : 


<IDOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01/EN" “http://www.w3.org/TR/ html4/strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 


a 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
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前 者 代表 HTML 4.0 的 严格 类 型 的 文档 类 型 声明 ， 后 者 代表 XHTML 的 文档 类 型 声明 ， 
这 两 种 DTD 将 使 浏览 霹 使 用 标准 模式 。 


说 明 : 


虽然 正 6.0 和 正 7.0 浏 览 器 对 Web 标准 没有 实现 完全 兼容 ， 但 相对 于 以 前 的 版 本 ， 正 の 


标准 化 程度 提高 了 很 多 。 所 以 读者 制作 标准 页 面 ， 应 使 用 XHTML 的 DTD、 
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元 素 的 非常 规定 位 方式 


表面 学 习 了 大 量 的 XHTML 元 系 的 定位 方法 ， 由 于 盒 模型 的 限制 ， 导 致 元 素 无 法 在 页 面 
中 随心 所 欲 进行 摆 放 。 但 是 网 页 内 容 需 要 一 些 能 随意 摆 放 的 元 素 ，CSS 则 提供 了 绝对 定位 模 
式 和 相对 定位 模式 ， 这 两 种 定位 模式 需要 设置 CSS 的 position 属性 。 

position 的 原意 为 位 置 、 安 置 、 状 态 。 在 CSS 布局 中 ，position 属性 非常 重要 ， 很 多 特 
殊 容 器 定位 必须 用 position 完成 。position 属性 有 4 个 值 ， 分 别 是 : static、absolute、 
fixed、relative, 其 中 static 是 默认 值 ， 代 表 无 定位 《一 般 用 于 取消 特殊 定位 的 继承 ， 恢 复 
お AT 人 ) 。 


“CSS 绝对 定位 


当 容 器 的 position 属性 值 为 absolute 时 ， 这 个 容 絮 即 被 绝对 定位 了 。 绝 对 定位 在 儿 种 定 
位 方法 中 使 用 最 广泛 ， 这 种 方法 能 够 很 精确 地 将 元 素 移动 到 你 想 要 的 位 置 。 使 用 绝对 定位 容 
涡 有 的 前 面 的 或 者 后 面 的 容器 会 认为 这 个 层 并 不 存在 ， 即 这 个 容 右 学 于 其 他 容 右 上 ， 它 是 独立 
出 来 的 ， 类 似 于 Photoshop 软件 中 的 图 层 。 所 以 position 属性 中 的 absolute 用 于 将 一 个 元 素 放 
到 国定 的 位 置 非常 方便 。 

当 多 个 绝对 定位 容器 放 在 同一 个 位 置 时 ， 显 示 哪 个 容 占 的 内 容 呢 ”类似 于 Photoshop 的 
图 层 有 上 下 关系 ， 绝 对 定位 的 容器 也 有 上 下 关系 ， 在 同一 个 位 置 只 显示 最 上 和 耐 的 容器 。 在 计 
算 机 显示 中 把 王 百 于 显示 屏 基 平面 的 方 癌 称 为 z 方 向 , CSS 争 対 定位 的 容器 的 z-index 属性 
对 应 这 个 方向 ，z-index 属性 的 值 越 大 ， 容 右 越 罪 上 。 即 同一 个 位 置 上 的 两 个 绝对 定位 的 容 右 
只 显示 z-index 属性 值 较 大 的 。 


注意 : 
当 容 器 都 没有 设置 z-index 属性 值 时 ， 默 认 后 面 的 容器 z 值 大 于 前 面 的 绝对 定位 的 


如 果 对 容器 设置 了 绝对 定位 ， 上 默认 情 况 下 ， 容 占 将 紧 挨 看 其 父 容器 对 象 的 左边 和 顶 边 ， 
即 父 容器 对 象 左上 角 。 定 位 的 方法 为 在 CSS 中 设置 容器 的 top (頂部 )、bottom (底部 )、left 
(左边 ) 和 right (右辺 ) 的 值 ， 这 4 个 值 的 参照 对 象 是 浏览 器 的 4 条 边 。 在 D:\web\ 目 录 下 创 
建 网 页 文件 (XHTML 1.0)， 命 名 为 pos ab.htm， 编 写 pos ab.htm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
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org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>CSS 的 绝对 定位 </title> 
<style type="text/css"> 
*{margin: Opx; 
padding:OpX;} 
#alliheight:500px: 
width:700px: 
margn-left:100px: 
background-color#FFCC99:! 
#box1,#box2,#box3,#box4,#boxS {width:200px; 
height:60px: 
border:Spx double #0000FF; 
position:absolute; + 
#box11 top:10px: 
left:90px: 
background-color#CC9900:) 
#box21 top:20px: 
left:120px: 
background-color# り 9CC00:) 
#box31 bottom:150px: 
left:70px: 
background-color# り 99CC00:) 
#box41 top:10px: 
right:120px: 
z-index:10; 
background-color# り 99CCO00:) 
#box5{ top:20px: 
right:180px: 
Z-Index:9: 
background-color# じ CC9900:) 
#a,#b,#c {width:350px; 
height: 100px; 
border: 1px solid #CC3300; 
background-color:#9966CC;} 
</style></head> 
<body> 
<div 1d="all"> 
<div id="box1"> 第 1 个 固定 的 div 容器 </div> 
<div id="box2"> 第 2 个 固定 的 div 容器 </div> 
<div id="box3"> 第 3 个 固定 的 div 容器 </div> 
<div id="box4'"> 第 4 个 固定 的 div 容器 </div> 
<div id="box5"> 第 5 个 固定 的 div 容器 </div> 
<div id="a"> 第 1 个 无 定位 的 div 容器 </div> 
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<div id="b"> 第 2 个 无 定位 的 div 容器 <7div> 
<div id="c"> 第 3 个 无 定位 的 div 容器 <7div> 
</div> 
</body> 
</html> 


这 里 将 外 部 div 设置 为 枉 FCC99 背景 色 ， 并 将 内 部 无 定位 的 div， 设 置 为 #9966CC 背 
景色 ， 而 将 绝对 定位 的 div 容器 ， 分 别 设置 为 #CC9900 和 #99CC00 背景 色 ， 并 设置 了 
double 类 型 的 边框 。 在 浏览 器 地 址 柱 中 输入 http://localhost/pos ab.htm， 浏 览 效 果 如 图 2-22 
所 示 。 


四 国生 万 me 
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图 2-22 CSS 绝对 定位 


从 本 例 中 可 看 出 ， 设 置 了 top、bottom、left 和 right 其 中 人 至少 一 种 属性 后 ，5 个 绝 
对 定位 的 div 容器 彻底 摆脱 了 其 父 容器 (id 名 称 为 all) 的 束缚 ， 独 立地 漂浮 在 上 面 。 
而 在 未 设置 z-index 属性 值 时 ， 第 2 个 绝对 定位 的 容器 ， 显 示 在 第 1 个 绝对 定位 的 容器 
上 方 ( 即 后 面 的 容器 z-index 属性 值 较 大 )。 相 应 地 ， 第 5 个 绝对 定位 的 容器 虽然 在 第 4 
个 绝对 定位 的 容器 后 面 ， 但 由 于 第 4 个 绝对 定位 的 容器 的 z-index 值 为 10, 第 5 个 绝对 
定位 的 容器 的 z-index 值 为 9， 所 以 第 4 个 绝对 定位 的 容器 ， 显 示 在 第 5 个 绝对 定位 的 
容器 的 上 方 。 

说 明 : 

读者 可 以 随意 拖 动 浏览 器 的 窗口 大 小 ， 观 察 绝对 定位 的 div 容器 的 位 置 变化 。 这 里 还 需 
要 注意 的 是 ， 在 正 6.0 和 IE7.0 中 的 浏览 效果 是 不 一 样 的 。 


2.42 ~ CSS 固 定 定位 


当 容 徐 的 position 属性 值 为 fxed 时 ， 这 个 容 喜 即 补 固定 定位 了 了。 国定 定位 和 绝对 定位 
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非 党 类似， 不 过 被 定位 的 容器 不 会 随 看 深 动 条 的 拖 动 而 变化 位 置 。 在 视野 中 ， 国 定 定位 的 容 
稚 的 位 連 走 不 会 改変 的 。 在 Diweb\ 目 录 下 创建 网 页 文件 (XHTML1.0)， 命 名 为 
pos fix.htm， 编 写 pos fix.htm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>CSS 固定 定位 </title> 
<style type="text/css"> 
* {margin:0px; 
padding:OpX;} 
#all{width:500px; 
height:900px; 
background-color:#FF9900:! 
#fixed1wndth:110px: 
height:90px: 
border:16px outset #993300; 
background-color:#00FFOO: 
position:aDsolute: 
toOD:30DX: 
left:20px:! 
#a1width:250px: 
height:350px: 
margin-left:30px; 
background-color:#0099FF: 
border:2px outset #000;} 
</style></head> 
<body> 
<div 1d="all"> 
<div id="fixed"> 固 定 的 容器 </div> 
<div id="a"> 无 定位 的 div 容器 </div> 
</div> 
</body> 
</html> 


这 里 将 外 部 div 设置 为 二 F9900 背景 色 ， 并 将 内 部 无 定位 的 div 设置 为 #0099FF 背景 


色 ， 而 将 固定 定位 的 div 容器 设置 为 #00FF00 背景 色 ， 并 设置 了 outset 类 型 的 边框 。 在 浏览 
器 地 址 栏 中 输入 http://localhost/pos fix.htm， 浏 览 效果 如 图 2-23 所 示 。 


读者 可 以 竹 试 拖 动 浏览 如 的 垂下 深 动 条 ， 固 定 容 如 的 位 置 不 会 有 任何 改变 。 不 过 正 6.0 


版 本 的 浏览 右 不 支持 fixed 值 的 position 属性 ， 所 以 网 上 类 似 的 效果 都 是 采用 JavaScript 脚本 


编程 完 


成 的 。 


:和 = 和 Web 2.0 标 准 静 态 网 页 的 搭建 


动 T:\ 练 习 贡 的 divw\ 定 位 方法 \pos_fix.htam 一 軒 icrosoft Internet Ezxplorer 图 回避 
文件 ぼ ) 编辑 区) 查看 VW) 履 療 ぬ ) 工具 和) 再 助 ⑪) 


へ 


Om の 回 回 @ Pm ma © 人 Se © る 
间 钼 十) http'//1ocalhost/pos_fix.htm ツ 图 特色 性 控 ” © snsgt 过 


图 2-23 CSS 固定 定位 


月 CSS 相对 定位 


当 容 器 的 position 属性 值 为 relative 时 ， 这 个 容 喜 即 被 相对 定位 了 。 相 对 定位 和 其 他 定位 相 
似 ， 也 是 独立 地 浮 在 上 和 面 。 不 过 相对 定位 的 容 融 的 top〔 顶 部 )、bottom (/ 撒 部 )、left (左边 ) 和 


right (右辺 ) 属性 参照 对 象 是 其 父 容 需 的 4 条 边 ， 而 不 是 浏览 需 窗 口 ， 并 且 相 对 定位 的 容 需 浮上 
来 后 ， 其 所 占 的 位 置 仍 然 留 有 空位 ， 后 面 的 无 定位 容器 仍然 不 会 “ 挤 ” 上 来 。 在 Di\web\ 目 录 下 
创建 网 页 文件 (XHTML 1.0)， 命 名 为 pos rel.htm， 编 写 pos_rel.htm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
く head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<style type="text/css"> 
*{ margin: Opx; 
padding:OpX;} 
#all{ width:SO0px; 
height:500px: 
background-color:#FF9900:! 
#fixed1width:130px: 
height:90px: 
border:15px ridge #0000FF: 
background-color:#99FFO0: 
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position:relative; 
top:15px: 
left: 1 Spx;} 
#a ガ b1width:250px: 
height:150px: 
background-color#FFCCFF: 
border:2px outset #000;} 
</style></head> 
<body> 
<div 1d="all"> 
<div id="a"> 第 1 个 无 定位 的 div 容器 </div> 
<div id="fixed"> 相 对 定位 的 容器 </div> 
<div id="b"> 第 2 个 无 定位 的 div 容器 </div> 
</div> 
</body> 
</html> 


这 里 将 外 部 div 设置 为 #FF9900 背景 色 ， 并 将 内 部 无 定位 的 div 设置 为 杜 FCCFF 育 景 
色 ， 而 将 相对 定位 的 div 容器 设置 为 #99FF00 背景 色 ， 并 设置 了 inset 类 型 的 边框 。 在 浏览 器 
地 址 栏 中 输入 http://localhost/pos reLhtm， 浏 览 效 果 如 图 2-24 所 示 。 


強 CSS 相 対 定位 二 icrosoft Internet Explorer 加 回回 
: 文件 ) 编辑 人 让) 查看 ”收藏 让 ) 工具 C) 帮助 加) 和 


Ou OO の 太る 


: 地 址 ⑪) | http://localhost/pos el. © 转 到 
第 1 个 无 定位 的 div 容 姨 


图 2-24 CSS 相对 定位 


相对 定位 的 容 右 其 实 并 未 完全 独立 ， 浮 动 范 围 仍 然 在 父 容 占 内 ， 并 且 其 所 占 的 空 日 位 置 
仍然 有 效 地 存在 于 前 后 两 个 容 融 之 间 。 


EE 記帳 葉 昌 eb 2.0 标 准 静 态 网 页 的 搭建 


| CSS 程序 简化 


虽然 CSS 文件 或 者 内 入 的 CSS 都 是 纯 文本 文件 ， 但 对 其 进行 整理 和 缩写 ， 对 于 减少 代 (>) 
公有 很 大 帮助 ， 当 CSS 定义 的 代 但 量 比较 多 时 ， 更 加 突显 整理 及 缩写 的 重要 性 。 
在 本 节 的 内 容 中 ， 我 们 将 介绍 CSS 程序 和 化 的 注意 事项 ， 有 具体 缩写 方法 将 结合 后 面 的 
实例 进行 详细 讲解 。 
加 缩写 属性 
使 用 Dreamweaver 定义 CSS 虽然 很 方便 ， 但 是 程序 生成 的 代码 比较 复杂 ，div 的 CSS 规 
则 定义 的 方 框 属 性 中 定义 的 填充 (padding) 属性 ， 系 统 会 目 动 将 上 下 左右 4 个 属性 分 开 定 
义 ， 而 实际 情况 下 可 以 缩写 在 同一 行内 。 
类 似 的 情况 还 有 : 背景 (background)、 字 体 (font)、 边 框 (border)、 列 表 (list-style )、 
項 充 〈padding)、 边 界 (margin) 等 属性 。 
@ 上 右 下 左 
填充 、 边 框 和 边界 都 有 4 个 边 ， 可 以 合并 成 一 行 ， 授 照 “ 上 右 下 左 ”( 顺 时 针 ) 的 顺序 
定义 ， 中 间 以 空格 来 分 隔 ， 如 “margin:5px 10px 15px 20px;”。 
如 果 “ 上 和 下 ”但 是 “ 左 = 右 ?”， 可 以 简写 成 3 个 值 (上 左右 下 )， 如 “margin:5px 
10px 15px;”， 等 同 于 “margin:5Spx 10px 1Spx 10px;”。 
如 果 “ 上 = 下 ” 且 “ 左 = 右 ” 可 以 人 简写 成 两 个 值 ( 上 下 左右 ), 如 “margin:10px 20px;”， 
等 同 十 “margin:10px 20px 10px 20px:”。 
如 采 上 下 左右 都 相等 ， 束 可 以 合并 成 一 个 值 ， 如 “margin:5Spx;”， 等 同村 “margin:Spx 
Spx Spx Spx; 。 
@ 缩 与 疝 色 
类 似 于 “#00FF00”， 这 样 两 位 重复 的 闫 色 值 ， 可 以 缩写 为 “#0F0”。 
@ 逢 属 性 
有 些 关 于 属性 的 定义 可 以 压缩 到 一 行 中 ， 各 属性 中 间 以 空格 分 隔 ， 如 “font”(〈 字 体 ) 的 
大 小 、 顔 色 和 粗 外 等 。 
頭 利用 通配符 
在 CSS 的 最 开始 部 分 定义 通用 CSS 规则 ， 通 用 规则 对 所 有 的 选择 符号 都 起 作用 ， 这 样 
就 可 以 统一 声明 绝 大 部 分 标签 都 会 涉及 的 属性 ， 比 如 边框 、 边 界 和 项 充 等 。 
用 通 配 符 【*】 送 行 声明 , 如 下 所 示 : 
| 
Margin:0: 
Padding:0; 
} 


此 时 ， 所 有 元 素 的 边界 和 填充 部 为 0。 而 在 其 后 可 以 再 进行 其 他 的 规则 声明 ， 后 面 声明 
的 规则 会 葡 换 反 前 面 的 通 配 属性 定义 。 这 样 是 为 了 避免 一 些 未 声明 的 元 素 ， 因 为 浏览 右 于 认 
样式 而 造成 的 错位 情况 。 
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国 继承 
子 元 素 上 自动 继承 父 元 素 的 属性 值 ， 像 字体 、 闫 色 等 ， 所 以 对 于 可 以 继承 的 CSS 规则 ， 
国 组 合 


某 些 有 相同 属性 的 选择 符 可 以 统一 定义 。 有 相同 属性 的 选择 符 中 间 以 逗号 “, ”分 隔 ， 
如 “body，#main，table{border:0; }”， 等 同 于 分 别 定 义 这 3 个 选择 符 的 边框 为 0。 

到 0px 与 0 

无 论 什 么 单位 ， 都 是 0， 因 此 0px=oin=0px=0。 

在 后 面 的 实例 章节 中 ， 将 以 实例 的 形式 详细 介绍 CSS 缩写 的 方法 。 到 这 里 ， 我 们 已 经 
介绍 了 div+CSS 的 网 页 布局 相关 知识 ， 相 信 读 者 已 经 掌握 div+CSS 大 体 的 布局 方法 ， 以 及 
列表 的 布局 元 素 及 元 素 的 概念 等 ， 在 后 面 的 草 和 中， 我 们 将 学 习 如 何 应 用 div+CSS 制作 静 
态 的 网 页 。 
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用 户 管 理 系 统 是 网 站 建设 中 常见 的 了 鲁 这 画 甸 前 页 产品 衣 曙 三 业 动态 应 用 密 出 。 职 标 我们 于 


一 种 动态 系统 。 用 户 管理 系统 一 役 具 有 ー 
登录 注册 、 资 料 修改 、 找 回 密码 及 注销 FYEyva ”WN 
身份 等 功能 。 本 章 将 创建 一 个 企业 的 国 轩 S CY < 入 
用 户 管理 系统 。 该 实例 中 主要 用 到 了 证 Ry Cle 
创建 数据 库 和 数据 表 、 建 立 数据 源 连 “ 国 et 
接 、 建 立 记 有 录 集 、 创 建 各 种 样本 页 、 上 ae mA Ea a rm _ 
添加 重复 区 域 显示 多 条 记录 、 页 面 之 ーー 

间 传 递 信息 等 方法 和 技巧 。 和 


i 


本 章 的 实例 效果 


1 年 唐 


教学 重点 


MAAATT 


搭建 用 户 管 理 系统 开始 平台 に 
数据 库 的 设计 与 连接 に 

登录 、 注 册 、 修 改 、 找 回 密码 功能 に 
用 户 管 理 系 统 开发 后 的 测试 に 


-和 
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愛 凡 搭建 用 户 管理 系统 开发 平台 


用 尸 管 理 系 统 当 用 于 大 型 的 动态 网 站 ， 一 般 部 在 网 站 的 上 页 单独 列 出 一 个 模块 用 于 用 请 


登录 ， 因 此 开发 用 户 管 理 系 统 首 先 要 制作 相关 的 静态 网 页 效果 。 用 户 管理 系统 在 网 站 首页 中 
的 位 置 如 几 3-1 所 示 。 


> 创 达 再 乞 首 页 产品 介绍 ”行业 动态 。 应 用 案例 。 联系 我 们 。 章 弄 ! 
ーーーー 一 EN3 デ よど は 人 新た 半 表 当 


县 项 产品 ca 
乐 乏 M320 全 国 痊 测 
中 問答 中 堅 議 ! 于 也 Sutallits "spe 


RH 网 客 反 外 | 素早 溢 画 视频 门 绍 “ee 联系 电话 
il。 il | TA Us O010-1234567 
了 0 出 3 站 


ee | 
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LT 
jbo8l36 ccw 宇 衣 折 二 す 


3-1 用 户 管理 系统 在 网 站 肯 页 中 的 位 置 


首页 的 布局 在 设计 的 过 程 中 需要 使 用 Photoshop 分 割 图 片 ， 配 置 HS 站 点 浏览 ， 建 立 本 
实例 的 站 点 chap03， 使 用 div+CSS 布局 静态 页 面 。 


う .1.]1 


下 和 面 就 开始 使 用 Photoshop CSS 的 切片 工具 分 割 首页 图 片 。 
首先 ， 在 本 地 计算 机 的 D 盘 建 并 站 点 文件 来 chap03， 在 站 点 文件 夹 中 建立 第 
用 文件 夹 〈 如 css、images、psd)， 如 图 3-2 所 示 。 然 后 从 光盘 里 找到 站 点 chap03/psd 文件 夹 
下 的 index.psd 文件 ， 将 其 复制 到 本 地 站 点 的 psd 文件 夹 中 。 


入 chap03 


: 文件 ) 编辑 于 ) 查看 (收藏 多 ) 工具 (I) 舌 助 ⑪) 
> | 国 : 


: 地 址 锯 ) a D: chapn3 


交 件 和 交 件 夹 在 务 

加 创 娃 一 个 新 文件 夹 
を 記 文 件 基肥 
sy 共享 此 文件 来 


< 新 加 卷 0:) 
加 我 的 文档 
记 共享 文档 
是 我 的 电脑 


WJ 网 上 邻居 


色 3-2 建 并 站 点 文件 来 
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局 动 Photoshop CSS 图 像 处 理 软 件 。 选 择 末 早 栏 中 的 “文件 ”一 “打开 ” 合 
令 ， 打开 首页 index.psd 文件 , 效果 如 岁 うー う 所 示 。 
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图 3-3 首页 可 切片 效果 


开始 分 割 各 部 分 图 片 。 首 先 切割 最 上 面 的 Logo 所 在 行 的 图 片 。 单 击 工具 箱 中 


的 “切片 工具 ”按钮 | 加 ， 从 场景 的 左上 和 角 拉 到 标题 的 右 下 角 ， 如 图 3-4 所 示 。 图 中 虚线 杠 
区 域 就 是 切片 大 小 ， 切 片 后 左上 角 会 显示 一 个 国 国 图 标 。 


Ea | es ーー ニテ を デ 
便 讼 辣 芳 
ChuangDa 


图 3-4 Logo 部 分 的 切片 效果 


接 下 来 分 割 其 他 图 片 部 分 。 保 持 “ 切 片 工 具 ” 按 钮 | 加 为 选中 状态 ， 按 下 
(Ctrl+H》 组 合 键 ， 打 开 辅 助 线 视 网 ， 可 以 先 用 辅助 线 分 割 好 需要 分 割 的 区 域 ， 再 按照 辅助 
线 ， 将 整个 网 页 分 割 成 15 个 小 图 片 ， 如 图 3-5 所 示 。 

导出 网 页 。 到 这 里 ， 切 族 工 作 基 本 完成 。 现 在 ， 要 做 的 就 是 把 它 导 出 为 真正 的 
网 页 。 选 择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 储 为 
Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 236,“ 扩 散 ” 模 式 ,“ 仿 
色 ” 值 为 100%, “Web 靠 色 ” 值 为 100%， 其 他 设置 如 图 3-6 所 示 。 

单 击 “ 储 存 ” 按 钮 ， 打开“ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 选择 “保存 
在 ”后 面 的 下 拉 三 角 按 钮 ”， 选 择 建立 的 chap03 文件 来， 其 他 设置 保持 默认 值 ， 如 图 3-7 
所 示 。 
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图 3-6 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


将 优化 结果 存储 为 
保存 在 ): | 回 chap03 


我 最 近 的 文档 ”| 器 psd 


四 


桌面 


立件 名 名) : index 保存 8) 


保存 美 型 ) : HTML 和 図 像 w.htm1) 取消 


设置 : 默认 设置 
切片 : 所 有 切片 


图 3-7 “将 优化 结 采 存储 为 ”对 话 框 设 置 


用 户 管 理 系 统 


单 击 “ 人 保存” 按钮 ， 完 成 保存 切 上 的 操作 。 打 开 保 存 文 件 的 路 径 ， 可 以 看 到 目 
动 生 成 了 一 个 images 的 文件 夹 ， 文 件 夹 中 是 首页 分 割 后 的 小 图 片 ， 设 计时 束 是 通过 调用 这 
些小 图 片 组 成 汉 页 效果 的 ， 如 图 3-8 所 示 。 


篇 iaages | > 
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全 联机 订购 照片 

台 打印 图 片 


立 件 和 文件 夹 芋 务 入 


四 创建 一 个 新 文件 来 
人 、 将 这 个 文件 夹 发 布 到 
e 


sy 共享 此 文件 来 


3-8 ”分割 后 的 小 图 所 


a 配置 用 户 管理 系统 站 点 服务 器 


使用 IS 在 本 地 计算 机 上 构建 用 户 管理 系统 网 站 的 站 点 。 

配置 系统 站 点 服务 器 的 步骤 如 下 : 

首先 启动 IIS, 在 IIS 窗口 中 右键 单 击 “默认 网 站 ”选择 菜单 中 的 “属性 ” 命 
令 ， 打开“ 默认 网 站 属性 ”对 话 框 ， 如 图 3-9 所 示 。 


点 认 网 站 岳 性 (| 
网 站 | ISAFI 季 选 器 | 主 目 录 | 文档 “|‖ 目录 安全 性 | HTTP 头 | 自 定 尽 错误 | 

网 站 标识 
描述 G) : 

IF 地 址 (I): 
TCF 端 口 J): 


连接 
连接 超时 (WD): 900 | 秒 
四 保持 HTTF 连接 () 


启用 日 志 记 录 旺 ) 


活动 日 志 格 式 ) : 
|W3C 扩展 日 志 交 件 格式 YY | | 尾 性 ).… 


图 3-9 “默认 网 站 属性 ”对 话 框 


ー の つ 
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单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 站 点 文件 夹 路 径 为 
“Di\chap03”， 其 他 设置 保持 默认 值 ， 如 图 3-10 所 示 。 


[请 点 1] 属性 


{ 另 一 台 计 算 机 上 的 共享 名 ) 
) 重 定向 到 URL 


時 で) 


口 脚 本 资源 访问 代 ) 记录 访问 Y】 
1 加 索引 资源 代 ) 
中 写 六 人) 


局 目录 浏览 @@) 
应 用 程序 设置 


应 用 程序 名 画 ): 默认 应 用 程序 册 阶 到 ) 


开始 位 置 : <[ 站 点 #] > 

| 配置 名 .| (な . 
执行 椒 限 下) 
应 用 程序 保护 人 の 


| 王寺 | 应 用 


图 3-10 设置 网 站 的 “本 地 路 径 ” 


EL) 单 击 “文档 ”选项 卡 ， 单 击 对话 框 中 的 “添加 ”按钮 ， 打 开 “ 添 加 默认 文档 ” 
对 话 框 ， 在 “默认 文档 名 ”文本 框 中 输入 index.asp， 如 图 3-11 所 示 。 


默认 网 站 属性 


点 让 也 档 省 三 1 
mg 
に 


色 3-11 设置 首页 的 默认 文档 名 


单 击 “ 和 确定” 按钮， 返回“ 文档” 选项 卡 ， 再 单 击 对 话 框 上 的 “向 上 移动 位 
置 ” 按 钮 国 ， 将 其 移动 到 第 一 位 ， 移 动 后 的 对 话 框 如 图 3-12 所 示 。 
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| 同 站 “| Tsmrr 端 洗 器 | 主 目录 | 文档 | 目录 安全 性 | ITTF 头 | 自 定义 错误 | 


记 ] 自用 文档 页 脚 甸 


| 


图 3-12 设置 浏览 的 优先 位 置 
单 击 “ 人 确定 ”按钮 ， 完 成 “默认 网 站 ”属性 ”的 配置 ， 由 于 前 和 面 已 经 使 用 
Photoshop CS5 对 页 面 进行 了 切片 ， 并 目 动 体 存 生成 了 index.html 页 面 ， 所 以 打开 IE 浏 
览 硕 输入 地 址 : http://127.0.0.1， 即 可 打开 页 和 面 切 片 后 的 效果 。 如 采 可 以 浏览 到 用 
Photoshop CSS 切片 后 的 网 页 效果 ， 说 明 站 点 服务 占 的 配置 已 经 完成 ， 就 可 以 开始 下 一 
个 步骤 的 制作 。 


| 创建 编辑 站 点 chap03 


使用 Dreamweaver CS5 进行 网 页 布局 设计 时 ， 首 先 需 要 用 定义 站 点 问 导 定义 站 点 ， 具 体 


操作 步 缀 如 下 : 

打开 Dreamweaver CS5， 选 择 亲 早 柱 中 的 “站 点 ”一 “省 理 站 点 ”命令 ， 打 开 
“管理 站 点 ”对 话 框 。 

对 话 框 的 左边 是 站 点 列表 框 ， 其 中 显示 了 所 有 已经 定义 的 站 点 。 单 击 右边 的 
“新 建 ” 按 钮 ， 从 弹出 的 下 拉 亲 单 中 选择 “站 点 ”命令 ， 则 打开 “站 点 设置 对 象 ” 对 话 框 ， 
进行 如 下 参数 设置 : 

“站 点 名 称 ”: chap03。 

“本 地 站 点 文件 夹 ” Di\chap03\。 

如 图 3-13 所 示 。 

单 击 列 表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 嚣 名称” chap03。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ” D:chap03\。 

“Web URL”: http://127.0.0.1。 

如 图 3-14 所 示 。 


一 和 
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头 点 毁 直 对 复 chap03 


Dreamweaver 站 点 是 了 网 站 中 使 用 的 所 有 六 件 和 资源 的 集合 。 Creamweaver 
站 点 通常 包 舍 两 个 部 分 ; 可 在 其 中 存储 和 处 理 艾 件 的 计算 机 上 的 于 地 区 件 
处 丰 可 三 其 中 将 相同 这 件 过 市 到 web 上 的 服务 璐 上 的 远程 信件 淆 。 


您 可 以 在 此 处 省 Dreamweawer 站 点 选择 本 地 如 件 池 和 省 称 。 
站 点 名 称 ; 
本 地 站 点 文件 来 ES 


图 3-13 ”定义 站 点 


站 点 设置 对 锡 chap03 


a | 
服务 器 名 称 ; 
和文 
文件 ー 
Web Ut: 


3-14 设置 “ 训 试 服务 右 ” 参 数 


单 击 “ 保 存 ” 按 钮 ， 则 完成 站 点 的 定义 设置 。 在 Dreamweaver CS5 中 就 已 经 拥 
有 了 刚才 所 设置 的 站 点 了 。 


US div+CSS 布 局 网 页 z 


整体 的 页 面 布局 规划 设计 如 图 3-15 所 示 。 


图 3-15 页 面 整体 布局 设计 


使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 ASP 文档 格式 ， 
将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>// 宣 告 为 ASP 文档 

<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet" href="css/style.css" type="text/css"/>// 链 接 CSS 样式 的 文件 

<title> 用 户 管理 系统 </title> 

</head> 


其 他 div 的 布局 代码 如 下 : 


<body> 
<div 1d="top"> 
<div id="logo"><img src="/images/index Ol.gif" width="247" height="91" /></div> 
<div 1d="banner"> 
<div id="banner1 "> 
<div class="banner1 "><a href="#"> 首 ”页 </a> <a hre 合 "#> 产 品 介 绍 </a> <a href="# が "> 行 
业 动 态 </a> ”<a hre 人 "如 > 应 用 案例 <a> ”<a hre 伍 "#"> 联 系 我 们 </a></div> 
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</div> 
<div 1d="banner2"> 
<div class="banner2"><a hre 人 f="#"> 促 销 产 品 </a> <a hre 传 "#f > 产品 目录 </a> <a hre 住 "#"> 上 品牌 日 


录 </a> <a hre 伍 '#'" 人 > 库存 产品 </a> <ahre 仁 咱 "> 解 决 方案 </a> <a hre 仁 "#"> 技 术 要 领 </a></div> 


</div> 
</div> 
<div 1d="banner3"> 
</div> 
<div 1d="tu"><1mg src="/images/index 05.gif'></div> 
<div id="deng"><img src="/images/index 06.gif"></div> 
<div 1d="sou"><1img src="/images/index 07.gif"></div> 
<div id="tul "><img src="/images/index 08.g1f"></div> 
</div> 
<div 1d="mid"> 
<div id="xitong"> 
<form method="POST" name="form1" id="form1" > 
<div class="use"> 用 户 : <input name="username" type="text" id="username'" size="10" /> </div> 
<div class="deng"></div> 
<div class="pass'> 蜜 何 : <input name="password" type="text" id="username" size="10" /> 
<input type="submit" name="button" id="button" value=" 登 录 " /> 
</div> 
</form> 
<div class="newuser"><a hre 丘 "Tegister.asp"> 注 其 新 用 </a></div> 
<div class="zhaohui"><a hre 伍 "lostpassword.asp"> 取 回 密 人 码 </a></div> 
</div> 


一 1 


<div id="news"> 


一 1 


<div class="news'"> 


<p> 北 海港 筹划 重大 资产 重组 … [2008-02-30]</p> 
<p> 境 外 银行 入 境 套利 五 路 径 .… [2008-03-21]</p> 
<p> 打 造 跨 国 公司 服务 链 ... [2008-04-22]</p> 
<p> 某 某 集 团 面 临 重 组 .… [2008-05-01]</p> 
</div> 
</div> 


<div id="product"><img src="/images/index 11.gif" width="460" height="141" /></div> 
<div id="quick"><img src="/images/index 12.gif" width="247" height="154" /></div> 
<div id="mail"><img src="/images/index 13.gif" width="317" height="154" /></div> 
<div 1d="tel"><img src="/images/index 14.gif" width="460" height="154" /></div> 
</div> 

<div 1d="bottom"> <img src="/i1mages/index 15.gif" た た </div> 

</body> 

</html> 


div 布局 完成 后 需要 将 该 页 面 保 存 ， 选 择 亲 单位 上 的 “文件 ”一 “ 男 存 为 ” 命 
令 ， 打 开 “ 另 存 为 ”对 话 框 ， 在 “文件 名 ”文本 框 中 输入 文件 名 为 “index.asp”， 单 击 “ 保 
存 类 型 ”后 面 的 下 拉 三 角 按钮 ， 在 打开 的 下 拉 列 表 框 中 选择 Active Server Pages (*.asp; 
*.asa) 末 单 项 ， 如 图 3-16 所 示 。 单 击 “ 你 存 ” 按 钮 完成 首页 的 布局 设计 。 


攻 光 二 请 区 用 户 管理 系统 


保存 を ①: On 。 9 全国 


css 


加 
桌面 
我 的 文档 
9 
我 的 电脑 
全 
同上 部 居 


文件 名 ): index. asp マ 保存 (8) 


保存 美 型 (T): [hctive Server Fages [*. asp;*. asa] Y | 


多 3-16 “为 行为 ”对 话 框 设 苇 
在 站 点 中 建立 css 文件 来， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


な 页 面 整 体 CSS*/ 
*{ margin:Opx; 


padding:OpX;} 
body{ width:100%; height: 100%; font-size:12px: background:#000;} 


此 设置 页 面 链接 */ 

a:link { 

color: #000000; 
text-decoration: none: 

} 

a:visited { 

text-decoration: none; 
color:#666666: 

) 

a:hoVer { 

text-decoration: underhne: 
color: #FF9900: 

} 

a:active { 

text-decoration: none; 

color: #000000; 

} 

/* 设置 所 有 图 族 的 边框 为 0*/ 
img {border: 0;} 

な 设置 最 外 层 居 中 显示 ， 实 现 让 整个 页 面 居 中 显示 */ 
#top,#mid,#bottom{ margin:auto; width:1024px;} 
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/* 设置 左 浮 动 的 标签 */ 
#logo,#banner,#banner3,#deng,#sou,#tul,#xitong,#news,#product,#quick,#mail,#tel 
{ float:left;} 
/*top 部 分 */ 
#banner{ 
width:778px; 
width:91px:! 
#bannerl 1 width:545px: 
height:62Dx: 
background-image:url(mages/index 02.gif):) 
.bannerl { width:320px: 
height:21px: 
margin-left:9px; 
margin-top:40px; 
font-size: 18px; font-weight:bold; + 
.bannerl a:link { 
color: #000000; 
text-decoration: none; 
} 
.bannerl a:visited { 
text-decoration: none; 
color:#000; 
) 
.bannerl a:hover { 
text-decoration: underhne: 
color: #FF9900: 
} 
.bannerl a:active { 
text-decoration: none; 
color: が 000000: 
} 
#banner21 width:545px; 
height:29px: 
background-image:url(/1mages/index 04.gif):) 
.banner21 width:400px: 
height:13px: 
margin-left:130px: 
margin-top: 10px;} 
.banner2 a:link { 
color: #000000; 
text-decoration: none: 
} 
.banner2 a:visited { 
text-decoration: none; 
color:#FFF; 
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.banner2 a:hover { 
text-decoration: underhne: 
color: #FF9900; 


) “ 
.banner2 a:active { > 


text-decoration: none; 

color: #000000: 

} 

#banner3{ width:232px; 

height:91px: 

background-image:url(/1mages/index 03.g1f);} 

.banner3 { width:150px: 
height:13px: 
margin-left:22px; 
margin-top:40px;} 

/*mid 部 分 

#xitong{ width:247px: 

height:141px: 

background-image:url(/1mages/index 09.gif):) 

.USe1 

margin-left:48px; 

margin-top:6px;} 

.deng{ 

margin-left: 100px; 

) 

.DaSS} 

margin-left:48px; 

margin-top: 1 Opx; 

} 

.newuser} 

margin-left: 140px; 

margin-top: 10px; 

) 

.Zhaohui1 

margin-left:140px: 

margin-top: 1 Opx; 

) 

#news1 width:317px: 

height:141px: 

background-image:url(/1mages/index 10.g1f);} 

.neWS1 

margin-left:20px: 

margin-top:45px; 

line-height: 19px; 

) 


制作 完成 后 在 正 6.0 浏览 器 中 的 显示 效果 如 图 3-17 所 示 。 


DPC 
か 


シク 
っ ンー 
ーー 


\ ン Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


动 用 中 菅 理香 峡 | 上 古 t 呈 FmmE Rrplorpr 
表層 中 晶 租 本 ) 看 看 站 中 天 了 工具 是 要 网 号 
im. 1 


产 晶 者 曙 ”行业 动 过 应 用 案例 联系 虹 们 


路 闻 包 划 


EE 
坊 中 力行 点 驶 到 再 王 睹 径 | 
厅 二 量 国 关 恒 而 关 二 

トキ エエ ee mil 


乐 竺 M320 宇 国 轿 测 

甲 周 理 〒 再 臣 電 不 葛 Swballiaa mm 
古 医 醒 持 | 留 诗 大 二 | 東田 百 骨 ! ez 副科 电 司 
E-mail Fm hi = 


IFEE FITM 


男 丙 南 。” 拓 再 画 晤 村 二 剛 前 


图 3-17 制作 完成 的 首页 效果 
将 首页 的 中 间 部 分 删除 ， 另 存 为 moban.asp 作为 二 级 页 面 备 用 ， 如 图 3-18 所 示 。 


引用 中 菅 理 重 睦 | ET 
去 件 如 0 中 竹本 ) 着 看 总) 号 醒 癌 ) 工 四 中 要 网 号) 


GR の 回 回 Pm 六 mx © BS eA る 
EE は TB EF 


首 页 产品 月 时 行业 动态 度 用 案例 ” 联系 我 们 


ン ペ ベッ 进 价 全 


es A 
> i WW 


二 相同 过 


陸 証 請 皿 


=- 


男 丙 南天 再 画 司 村 二 出前 


图 3-18 制作 的 二 级 页 面 效 末 


数据 库 设 计 与 连接 


用 户 管理 系统 要 设计 一 个 存储 用 户 注册 资料 的 数据 库 文件 。 实 例 设计 中 使 用 的 Access 
人 を 次 


数据 库 user 数据 表 如 图 3-19 所 示 ， 在 后 面 的 实例 中 能 够 利用 该 表 实 现 用 户 名 、 答 码 等 资料 


EE 问 汪 玉 用 户 管理 系统 


的 添加 。 


en 回 ー 
" 本 机 时 計 配 生 画 牙 二 上 库 工具 
』 


加 后 莹 写 沿 时 用 户 钙 酉 如 可行 站 证 起 呈 和 的 二 
各 。 志和 司 可 查看 有 站 点 过 后 呈 的 得 且 。 


EECTTDET 思 , 


图 3-19 实例 设计 中 的 user 数据 表 


有朋 数据 库 设计 


| 


用 户 系 统 数据 库 设 计 的 步骤 如 下 : 

创建 数据 库 的 第 一 步 是 根据 要 制作 的 网 站 所 要 面 对 的 访问 者 做 一 个 调 碍 分 析 ， 
了 解 来 访 者 的 情况 。 

根据 第 一 步 的 调 碍 分 机 ， 设 计数 据 表 user 的 字段 结构 ， 如 表 3-1 所 示 。 


表 3-1 user 数据 表 结 构 

意 义 字段 名 称 数据 类 型 字段 大 小 必 填 字段 允许 空 字符 串 < 

主题 编号 ID 自动 编号 长 整 型 有 无 重复 ) 

用 户 账号 username 文 本 20 是 在 本 

用 户 密码 password 文本 20 是 否 

真实 姓名 truename 文本 20 是 否 六 

用 户 性 别 sex 文本 2 是 否 无 

邮箱 地 址 Email 文本 50 合 是 无 
密码 遗失 提示 问题 Question 文本 50 是 否 无 
密码 提示 问题 答案 Answer 文本 50 是 否 无 

用 户 权 限 Authority 数字 长 整 弄 无 

说 明 : 


数据 库 中 常见 属性 解释 如 下 : 

字段 大 小 : 在 自动 编号 的 字段 大 小 中 常见 的 是 长 整 型 和 同步 复制 ID， 长 整 型 是 Access 項目 中 
的 一 种 4B (32bit ) 数据 类 型 ， 存储 -2 ( 即 -2 147 483 648)~2 1 一 1 ( 即 2147483 647) 之 间 的 数字 。 

必 填 字段 : 是 一 些 用 户 必须 填写 的 字段 ， 在 更 新 数据 库 时 ， 如 果 为 空 将 无 法 更 新 。 


| 
bo 
wa 二 
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允许 空 字符 串 : 空 字符 串 ， 首 先 它 是 字符 串 ， 但 是 这 个 字符 串 没 有 内 容 。 空 就 是 null, 


不 是 任何 东西 ， 不 能 等 于 任何 东西 。 
索引 : 索引 是 一 个 单独 的 、 物 理 的 数据 库 结 构 ， 它 是 依赖 于 表 建 立 的 ， 它 提供 了 数据 库 


编排 表 数 据 的 内 部 方法 。 一 个 表 的 存储 是 由 两 部 分 组 成 的 ， 一 部 分 用 来 存放 表 的 数据 页 面 ; 
另 一 部 分 存放 索引 页 面 。 

首先 运行 Microsoft Access 程 序 。 単 市 “空白 数 据 座 ” 披 捉 | 記 , 在 主 界 面 的 右 
侧 打 开 “ 空 白 数 据 库 ”面板 ， 如 图 3-20 所 示 。 单 击 “ 空 白 数 据 库 ”面板 上 的 “浏览 到 某 个 
位 置 来 存放 数据 库 ” 按 钮 医 ， 打 开 “ 文 件 新 建 数据 库 ” 对 话 框 。 


Cs) コ = 
コ 
w 
| |< 
I py A と ーー 
es FF Microsoft Office Access 
ores offien Online eT 
し に 2 『 ] 
网 lt 1 


鱼 色 职 机 国 图 


图 3-20 打電 “空白 数 据 麻 ” 面板 


在 “你 存 位 置 ” 后 面 的 下 拉 列 表 框 中 选择 前 面 创建 站 点 chap03 中 的 mdb 文件 
来， 在 “文件 名 ”文本 框 中 输入 文件 名 user， 为 了 让 创建 的 数据 库 能 被 通用 ， 在 “保存 类 


型 ”下 拉 列 表 框 中 选择 “Microsoft Access 数据 库 (2000)” 选 项 ， 如 图 3-21 所 示 。 


保存 位 加 て ): 2 nd 
轩 我 最 ii 文档 | 
车 点 面 

加 我 的 交 档 

本 我 的 电脑 

9 网 上 和 领 拓 


| 文件 名 の : meim 
| 保存 基 型 区 ) [Microsoft Office Access 2000 数据 库 (*.mab) 


图 3-21 “文件 狐 建 数据 库 ” 对 话 框 


户 管 理 系统 


单 击 “确定 ”按钮 ， 人 返回 “ 空 晶 数据库” 面板， 再 单 击 “ 空 日 数据 库 ” 面 板 的 
“创建 ”按钮 ， 即 在 Microsoft Access 中 创建 了 一 个 usermdb 数据 库 文 件 ， 同 时 Microsoft 
Access 目 动 默认 生成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 如 图 3-22 所 示 。 


> 


色 3-22 创建 的 默认 数据 表 
右键 单 击 “ 表 1: 表 ”， 打 开 快 捷 末 单 ， 执 
行 快捷 采 单 中 的 “设计 视图 ”命令 ， 打 开 “ 男 存 为 ”对 
话 框 ， 在 “ 表 名 称 ” 文 本 框 中 输入 数据 表 名 称 user， 如 
图 3-23 所 示 。 
单 击 “ 确 定 ” 投 钮 ， 系 统 将 目 动 打开 创建 好 
的 user 数据 表 ， 如 图 3-24 所 示 。 


3-23 “为 存 为 ”对 话 框 


/En [= )s 要 工 周 。 user : 歌 扎 机 IAccess 2002 - 2003 立件 属 式 )- Mi に c= 百 过 
可 
开 培 创建 ”外 部 下 二 类 这 库 I 风 i 座 it 六 
ss 播 k 行 | 「 
短路 行 时 ジジ 
| 后 压 里 区 仁 囊 ”更 5 


字 自 名称 其 据 类 型 局員 = 
li 自动 息 号 国 
守 配 題 性 

Ez 

字 获 去 小 发难 天 

新 置 通才 

aran 

标题 

素 引 育 [ 元 重 向) 

智能 标记 nc 

ーーー aa 不 股 志 积 最 扩 可 到 54 全 宰 特 ( 和 括 主 橋 j。 拉 


Fl 情 可 查看 有 站 李 帆 名 称 的 程 助 。 


图 3-24 建立 的 user 数据 表 
披 表 3-1 输入 各 字段 的 名 称 并 设置 其 相应 属性 ， 结 果 如 图 3-25 所 示 。 


za Ll: 


Pe 


说 明 : 
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Access 为 user 数据 表 自 动 创建 了 一 个 主键 值 ID， 主 键 是 在 所 建 数据 库 中 建立 的 唯一 一 个 真 
实 值 ， 数 据 库 通 过 建立 主键 值 ， 方 便 后 面 搜索 功能 的 调用 ， 但 要 求 所 产生 的 数据 没有 重复 。 


BID 
‘username 
| password 
‘truenanme 
sex 
Emai1 
| Question 
Bnswer 
huthority 


た = 工 羡 计 #l すず rr 世 


| 了 而 本- 
|) | Xe TR \ ”TID 


3-26 创建 的 user 数据 表 


为 了 方便 用 户 访 问 ， 可 以 在 数据 库 中 预先 编 辑 一 些 记录 对 象 ， 其 中 admin 用 户 


( 即 为 管理 员 ) 的 权限 ( 即 Authority 字段 ) 值 为 1， 其 余 用 户 权 限 值 为 0, 
如 图 3-27 所 示 。 


es) [| = 囊 工 具 usef : 车 更 库 所 ce 2002 - 3003 豆 性 物 匠 1- ML -= 本 入 
一 ”| 开机 | 创建 針 陣 数 放 。 扶风 FI 凡 天主 由 
8 ビュ ー _- 本 下 | a Th 

bz pn 8 本 ~ | 课 包 | ra | | 4 『 マコ - 2 = 
me 。 Br 本 午 澤 到 二 下 | 人 i| sg 7 箇 庫 導 夫 
・ ・ 太 " 玉 "国画" dd i 
| 而 男 明和 半 板 " に 1 "| 糖 式 交 本 皇 序 和 符 通 是 本 二 中 式 藤 涯 終 摘 | 
达 ” 屋 邓 奢 舍 “ 巨 大 古 了 相生 怕 让 的 相 划 二 时 | 括 项 _. に 
所有 守 = ee 


-~ Et  ・ mestion "answer -author 。， 瞩 如 新 其 记 
admirWhbcul 管理 者 是 众 ? admin 1 
hmWhhcultur 最 喜 下 的 工作 同 页 得 计 0 


3-27 user 数据 表 中 输入 的 记录 


即 为 一 般 用 户 ， 
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编辑 完成 ， 单 击 “ 保 存 ” 按 钮 图 |， 完 成 数据 库 的 创建 ， 最 后 关闭 Access 
软件 。 


数据 库 连 接 ) ©® 


在 数据 库 创建 完成 后 ， 需 要 在 Dreamweaver 中 建立 数据 源 连 接 对 象 ， 才 能 在 动态 网 页 中 
使 用 这 个 数据 库 文件 。 接 下 来 介绍 在 Dreamweaver 中 用 ODBC 连接 数据 库 的 方法 ， 在 操作 
的 过 程 中 要 注意 ODBC 连接 时 参数 的 设置 。 

说 明 : 

开放 数据 库 互 连 (ODBC ) 是 Microsoft 引用 的 一 种 早期 数据 库 接 口技 术 。Microsoft 引 
用 这 种 技术 的 一 个 主要 原因 是 ， 以 非 语言 专用 的 方法 提供 给 程序 员 一 种 访问 数据 库 内 容 的 简 
单方 法 。 换 名 话说 ,访问 DBF 文件 或 Access Basic 以 得 到 MDB 文件 中 的 数据 时 ， 无 须 懂 得 
Xbase 程序 设计 语言 。 

一 个 完整 的 ODBC 由 下 列 几 个 部 件 组 成 : 

回 应 用 程序 (Application ): 该 程序 位 于 控制 面板 ODBC 内 ， 其 主要 任务 是 管理 安装 
的 ODBC 驱动 程序 和 管理 数据 源 。 

Du 驱动 程序 管理 器 (Driver Manager): 驱动 程序 管理 器 包含 在 ODB DLL 中 ， 对 用 户 
是 透明 的 ， 其 任务 是 管理 ODBC 驱动 程序 ， 是 ODBC 中 最 重要 的 部 件 。 

加 ODBC 驱动 程序 : 是 一 些 DLL, 提供 了 ODBC 和 数据 库 之 间 的 接口 。 

較 数据 源 : 数据 源 包含 了 数据 库 位 置 和 数据 库 类 型 等 信息 ， 实 际 上 是 一 种 数据 连接 的 
抽象 叫 法 。 

基体 连接 步骤 如 下 : 

依次 单 击 “ 欣 制 面 板 ” 一 “管理 工具 ”一 “数据 源 (ODBC)” 一 “系统 
DSN ”命令 ， 打 开 “ODBC 数据 源 管 理 右 ”中 的 “系统 DSN” 选 项 卡 ， 如 图 3-28 所 示 。 


を 0DBC 数据 涯 管理 需 


用 户 DSW 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 (8): 
驱动 程序 添加 ⑪).… | 


La | 
EEC | 


ODEC 系统 数据 源 存 诗 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
统 数 据 温 对 当前 机 器 上 的 所 有 用 情 可见， 包括 WT 服务 。 


图 3-28 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 选 项 卡 


在 图 3-28 中 单 击 “ 添 加 (D)” 投 钮 ， 打 开 “ 创 建新 数据 源 ” 对 话 框 ， 在 “ 创 
建新 数据 源 ” 对 话 杠 中， 选择 Driver do Microsoft Access (*.mdb) 选项 ， 如 图 3-29 所 示 。 


世 建 要 玫 损 谣 


1 LT ロニ EE 1 」 
TP Ho FT Fp tk. db で ) 
Driver do Microsoft Excel [本 . wls) 
Driver do Microsoft Faradox [*.db ] 
Driver Far o Microsott Visual FoxFro 
Microsoft hecess Driver [*.mdb) 
Microsoft hecess-Treiber (mdb 
Microsoft dBase Driver 人. dbf) 
Nicrosoft dBase WFF Driver (. dbf) 

を | 


图 3-29 “创建 新 数据 源 ” 对 话 框 


单 击 “完成 ”按钮 ， 打开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 
源 名 (N)” 文 本 框 中 输入 user， 如 图 3-30 所 示 。 


ODBC icrosoft Access 安装 


系统 数据 库 


* 元 尼 ) 
个 数据 库 这 ): 


-一 一 一 这 项 > | 


图 3-30 ” “ODBC Microsoft Access 安装 ”对 话 框 


在 图 3-30 所 示 对 话 框 中 单 击 “ 选 择 (S)” 按 钮 ， 打 开 “ 选 择 数据 库 ” 对 话 
框 ， 单 击 “ 了 驱动 器 (V)” 列 表 框 右 侧 的 下 拉 三 角 按钮 [了 |， 从 下 拉 列 表 框 中 找到 创建 数据 库 
步骤 中 数据 库 所 在 的 盘 符 ， 在 “目录 (D)” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 
夹 ， 然 后 单 击 左上 方 “数据 库 名 (A)” 选 项 组 中 的 数据 库 文 件 user.mdb， 则 数据 库 名 称 自动 
添加 到 “数据 库 名 (A)” 下 的 文本 框 中 ， 如 图 3-31 所 示 。 


数据 库 名 避 ) 目录 血 ) : 
Ins er. mdb d: chanH3!mdb 


語 liiiGElll 和 ll 驱动 器 0): 


|Access 数据 库 fm 下 | | 国 4: 新吉 巻 "| 


图 3-31 选择 数据 库 


用 戸 管 理系 金 


第 3 草 


找到 数据 库 后 ， 单 击 “ 确 定 ” 按 钮 回 到 “ODBC Microsoft Access 安装 ”对 话 
框 中 ， 再 次 单 击 “确定 ”按钮 ， 将 返回 到 “ODBC 数据 源 管 理 器 ”中 的 “系统 DSN” 选 项 
为 “user”、 了 驱动 程序 为 “Driver do 


卡 ， 可 以 看 到 “系统 数据 源 ” 中 已 经 添加 了 一 个 名 称 
Microsoft Access (*.mdb)” 的 系统 数据 源 ， 如 图 3-32 所 示 。 


を OoDBC 数据 源 管 理 喜 
用 户 DSW 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 


系统 数据 源 (8): 
驱动 程序 添加 Q⑩).… 
ET Driver do Microsoft Access (*.mdb) 
删除 8) 
配置 CC)... | 


0DBC 系统 数 括 温存 诗 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
统 数 据 汰 对 当前 机 坛 上 的 所 有 用 尸 可 见 ， 包 质 T 服务 。 


图 3-32 添加 系统 数据 源 后 的 “系统 DSN” 选 项 卡 


再 次 单 击 “ 确 定 ” 按 钮 ， 完 成 “ODBC 数据 源 管理 器 ”中 “系统 DSN” 的 


命 人 


设置 。 
局 动 Dreamweaver CS5， 打 开 前 面 制 作 的 index.asp 静态 页 面 。 在 Dreamweaver 
打开 “数据 库 ” 面 板 ， 如 网 3-33 


软件 中 执行 菜单 中 的 “文件 ”一 “窗口 ” 一“ 数据库” 
所 示 。 
单 击 “数据 库 ” 面板 中 的 [ 国 按 钮 ， 弹 出 如 图 3-34 所 示 的 菜单 ， 选 择 “ 数 据 源 


名 称 (DSN)” 选 项 。 


ロゴ 粳 定 i Fe re A 
+ 一 档次 型 : EF VESeript 


GC 


若 要 在 该 页 面 上 司 用 动态 数据 : 

汶 访 站 件 创建 站 点 。 

2. 选择 一 种 立 挡 类型 。 

we 3. 设置 站 点 的 铀 二 服务器。 
4. 电击 上 面 的 + 按钮 创建 连 


に 1 . 


目 定 总 广 按 字 社 审 


者 DSH) 


图 3-33 “数 指 麻 ” 面板 图 3-34 选择 “数据 源 名 称 (DSN) ”选项 
打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 ” 文 本 框 中 输入 connuser, 単 
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击 “ 数 据 源 名 称 (DSN)” 下 拉 列 表 框 右 侧 的 下 拉 三 角 按 铀 着 ， 从 打开 的 数据 源 名 称 (DSN) 下 
拉 列 表 中 选择 user， 其 他 保持 默认 值 ， 如 图 3-35 所 示 。 


数据 潭 和 名称 (D5N) 


连接 名 称 :commuser 
数据 源 名 称 (DSH): ussr 
用 戸 名 : 
密码 : | 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 SW 
〇 使 用 本 地 DSH 


图 3-35 选择 数据 源 名 称 


在 “数据 源 名 称 CDSN)” 页 面 中 ， 单 击 “ 确 定 ” 按 钮 后 完成 此 步 又。 此 时 在 
“数据 库 ” 面 板 中 的 内 容 应 如 网 3-36 所 示 。 
同时 ， 在 网 站 根 目 录 下 将 日 动 创建 名 为 Connections 的 文件 夹 ， 访 文件 夹 内 有 
一 个 名 为 connuser.asp 的 文件 ， 它 可 以 用 记事 本 打开 ， 内 容 如 图 3-37 所 示 。 
| 
十 一 并 档 闪 型 : hsP WEScript 人 


CUTITIIHSET 一 记事 本 

文件) 编辑 人 让 ) 格式 Q) 查看 QM 帮助 (0) 

くる へ 
" FileName="Connection odbc_ conn_dsn.htm" 

. Type="ADO" 

' DesigntimeType="'ADO" 

' HTTP="'false"" 

' Catalog="""" 


Dim HH connuser_ STRING 
HM connuser STRING = "dsn=user;" 
る > 


图 3-36 设置 的 数据 库 图 3-37 目 动 生成 的 connuser.asp 文件 


说 明 : 
connuser.asp 文件 中 记载 了 数据 库 的 连接 方法 及 连接 参数 ， 其 各 行 代码 的 含义 如 下 : 
ポ ネ ポポ ポポ ポポ ポポ ポポ ポポ ホ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポ 
<% 
' FileName="Connection odbc conn dsn.htm" 
' Type="ADO" 
// 关 型 为 ADO 
' DesigntimeType="ADO" 
// 前 三 行 代码 是 设置 数据 库 的 连接 方式 为 ADO 的 连接 方法 


' HTTP="false" 

/设置 http 的 连接 方法 为 否 
' Catalog="" 

/设置 目录 为 空 


' Schema="" 
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/概要 内 容 为 空 

Dim MM user STRING 

/定义 为 user 数据 库 名 的 绑 定 

MM user STRING = "dsn=user;" 

/设置 为 DSN 数据 源 连 接 > 
%> 


ポポ ボネ ポポ ネネ ホネ ネネ ホホ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホホ ネネ ポポ ネネ ホネ ホネ ネネ ホネ ネネ ホホ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホネ ポポ ホネ ネネ ポポ ネネ 
如 果 网 站 要 上 传 到 远程 服务 器 端 ， 则 需要 对 数据 库 的 路 径 进行 更 改 。 
选择 菜单 栏 上 的 “文件 ”一 “保存 ”命令 ， 则 完成 数据 库 的 连接 。 


登录 功能 


和 
en 
a a 
ELM 
に re 


用 户 管理 系统 所 需要 的 页 面 比 较 多 ， 所 以 怖 要 进行 一 个 整体 的 规划 。 在 该 系统 中 ， 除 了 
可 以 让 用 户 输 入 “用 户 名 ”和 “和 密码 ”进行 登录 外 ， 还 应 该 包括 “注册 新 有 用户 ”和 “ 找 回 站 失 
密码 ”的 功能 。 当 用 户 在 “用 户 名 ”文本 框 和 “密码 ”文本 框 中 分 别 输入 用 户 名 和 密码 ， 并 单 
击 “ 登 录 ” 投 钮 后 ， 将 进入 一 个 登录 页 面 ， 该 页 面 应 该 具有 验证 用 户 名 和 密码 是 售 正 确 的 功 
能 。 如 果 用 户 名 和 密码 都 正确 ， 将 直接 进入 用 户 管 理 系统 主页 ; 如 条 不 正确 ， 则 将 显示 不 正确 
信息 ， 并 提示 重新 注册 信息 。 如 采 是 新 用 户 ， 则 可 以 直接 单 击 “ 注 册 痢 用 户 ” 链 接 文 本 ， 进 入 
注册 新 有 用户 页 面 。 如 来 起 记 密 人 码 ， 则 可 以 单 击 “ 取 回 密码 ”文本 链接 ， 进 入 找 回 壮 失 密码 的 页 
面 。 另 外 ， 还 需要 为 用 户 提供 修改 个 人 资料 和 注销 吴 份 的 功能 。 昌 然 ， 这 两 个 功能 没有 在 该 页 
面 上 显示 出 来 ， 但 是 它们 和 注册 信息 都 有 直接 关系 ， 因 此 ， 它 们 也 属于 用 户 管理 系统 乙 中 。 

通过 上 面 的 分 析 与 设计 ， 该 用户 管 理 系 统 主要 由 以 下 一 些 动态 网 页 构成 ， 见 表 3-2: 


表 3-2 用 尸 数据 设计 表 


需要 制作 的 页 面 页 面 名 称 
用 户 登 录 页 面 index.asp 
登录 成 功 页 面 welcome.asp 
登录 失败 页 面 loginfail.asp 
注册 新 用 户 页 面 register.asp 
注册 成 功 显示 页 面 registerok.asp 
注册 失败 显示 页 面 registerfail.asp 
用 户 找 回 遗 失 密 码 的 页 面 lostpassword.asp 


显示 提示 问题 的 页 面 


正确 回答 问题 后 显示 密码 的 页 面 


修改 个 人 资料 的 页 面 
用 户 删 除 账号 的 页 面 


showquestion.asp 
showpassword.asp 
userupdate.asp 


userdelete.asp 


登录 主页 面 J) 


在 用 户 访问 该 登录 系统 时 ， 首 移 要 进行 吴 份 验证 ， 这 个 功能 是 徘 登 录 页 面 实现 的 。 如 末 


-< の 
ンー 
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输入 的 用 户 名 和 密码 与 数据 库 中 己 有 的 用 户 名 和 和 密 人 码 相 逻 配 ， 则 登录 成 功 ， 进 入 到 
welcome.asp 页 面 ; 如 果 输 入 的 用 户 名 和 密码 与 数据 库 中 已 有 的 用 户 名 和 密码 不 匹配 ， 则 登 
录 失 败 ， 进 入 显示 登录 失败 的 页 耐 loginfail.asp。 

制作 步骤 如 下 : 

站 移 来 看 一 下 登录 系统 中 者 包含 哪些 内 容 ， 当 用 户 进 入 站 点 后 ， 看 到 的 是 登录 
系统 的 页 面 index.asp， 3-38 所 示 为 登录 系统 的 主页 面 。 


归 用 户 怎 理 系 续 Microroft Intornot Esplorer 
XO RU KEO CRU 工具 0) HM 
Om 日 -四 四 分 Patmos Ee OAS 
人 者 | tp AI ODN wy 


产品 介绍 。 行业 动态 ”应 用 案例 联系 我 们 


る な ナタ \ ケ 2 ニョ 


EE A HE St 
N ~ i / oh | し 


开始 于 过 


电疗 公 和 天 ee 产品 推 记 。 局 斯 产 局 


案 田 西 调 视频 间 绍 ms 联系 电话 


er ER -PP Te 010-1234567 
5 > 3 。 本 
> で を こる .en 
細 百 京 店 圧 陸 生 ”天子 我 们 一 -3m | + 補給 文大 ニー | 


图 3-38 ”登录 系统 主页 面 


index.asp 页 面 是 这 个 登录 系统 的 首页 ， 也 是 用 于 输入 登录 信息 的 页 面 。 打 开 刚 创建 
的 index.asp 负面， 输入 网 页 标题 “用 户 管 理 系 统 ”， 选 择 末 单 柱 上 的 “文件 ”一 “保存 ”命令 。 
选择 “用 户 :” 在 “属性 ”面板 的 “文本 域 ” 文 本 框 中 设置 名 称 为 
“username”， 参数 设置 如 图 3-39 所 示 。 
者 


| 交 本 域 字符 宽度 (Wf) 类 型 ① 単行 G」 〇 ① 多 行員 〇 容 呈 中) 
時 を 条 数 | | 站 中 [| ーー 
| ] 茜 用 品 ) 
[| | 只 志 人) 


图 3-39 ”设置 登录 用 户 名 的 字段 名 称 


选择 “和 密码: ”在 “属性 ”和 面板 的 文本 域 文本 框 中 设置 名 称 为 “password”， 参 
数 设置 如 图 3-40 所 示 。 

为 了 让 没有 注册 的 浏览 者 方便 注册 ， 需 要 输入 “注册 狐 用 户 ” 文 本， 并 将 该 文 
本 设置 为 一 个 切换 到 用 户 注 册页 面 register.asp 的 链接 对 象 ， 以 方便 注册 新 用 户 ， 效 果 如 图 3-41 
所 示 。 


如 果 已 经 注册 的 用 户 态 记 了 密码 ， 
输入 “ 取 回 密码 ”文本 ， 
接 对 象 ， 以 方便 用 户 取 回 窗 全， 如 图 3-42 所 示 。 


区 区 本 域 字符 宽度 中) 类 型 四 单行 @) 〇 多 行 ⑪ の 〇 密 嘆 @ 
最 多 字符 数 | 初始 值 人 多 


|] 禁 用 中 ) 
器] 只 读 鱼 ) 


图 3-40 ”设置 登录 用 户 密码 的 字段 名 称 
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3-41 Y.“ 注 期 新 用 戸 ” 筆 接 
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图 3-42 ” 取 回 密码 设置 


还 希望 以 其 他 方式 能 够 重新 获得 
并 将 该 文本 设置 为 一 个 切换 到 取 回 密码 页 面 lostpassword.asp 的 链 


蜜 価 , 可以 
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表单 编辑 完成 后 ， 下 面 来 编辑 该 网 页 的 动态 内 容 ， 使 用 户 可 以 通过 该 网 页 中 表 
单 的 提交 实现 登录 功能 。 选 择 菜 单 栏 中 的 “窗口 ”一 “服务 器 行为 ”人 命令， 打开“ 服务 器 行 
为 ”面板 。 单 击 该 面板 上 的 “+” 号 按钮 ， 从 打开 的 菜单 中 选择 “用 户 身份 验证 ”一 “登录 


用 户 ” 命 令 ， 如 图 3-43 所 示 ， 向 该 网 页 添加 登录 用 户 的 服务 器 行为 。 
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3-43 添加 “登录 用 户 ， 的 服务 器 行为 


打开 如 图 3-44 所 示 的 “登录 用 户 ” 对 话 框 ， 由 于 该 对 话 框 中 需要 设置 的 参数 


较 多 ， 下 面 将 逐一 回 读 者 进行 介绍 


从 表单 获取 输入 : マ 
用 名手 自 usermane 。 MM 
密码 字段 : passwerd 。。 マツ 

使 用 演 拉 让 无 。。 "| 


一 


用 户 名 列 : 司 


密码 列 : 


如 果 谷 录 成 功 , 转 到 :| ーー 


し | 转 到 前 一 个 URL( 如 果 它 存在 ) 
如 果 登 录 失 败 ， 转 到 |: | 


基于 以 下 项 限制 访问 : (や 用 户 名 和 密码 
〇 C5 用 户 各、 密码 和 访问 级 别 
获 职 级 别 自 : 


3-44 “登录 用 户 ” 对 话 框 


“登录 用 户 ” 对 话 框 的 第 一 部 分 用 来 设置 表单 中 的 文本 域 的 功能 ， 


下 役 次 : 


@ 从 “从 表单 获取 得 入 ”下 拉 列 表 中 选择 该 服务 器 行为 使 用 网 页 中 的 forml 表单 对 象 中 


浏览 者 填写 的 对 象 。 
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@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 username 对 象 ， 设 定 该 用 户 登 录 服 务 器 行 
为 的 用 户 名 数据 来 源 为 表单 的 username 文 本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 该 用 户 登录 服务 器 行为 
的 用 户 名 数据 来 源 为 表单 的 password 文 本 域 中 浏览 者 输入 的 内 容 。 

“登录 用 户 ” 对 话 框 的 第 二 部 分 是 用 来 设置 服务 器 行为 使 用 到 的 数据 源 连 接 的 一 些 参 数 。 

@ 从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
CONNUSECTo 

@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 器 行为 使 用 到 的 数据 库 表 对 象 为 user。 

@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 user 存 储 用 户 名 的 字段 为 username 字 段 。 

@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 user 存 储 用 户 密码 的 字段 为 password 字 有 段 。 

完成 后 的 设置 如 图 3-45 所 示 。 


司 用 连接 矣 证 : | conmnssr 
表格 : | user i 
用 尸首 到 : username 
密码 出: | password 


图 3-45 设置 数据 源 连 接 


“登录 用 户 ” 对 话 框 的 第 三 部 分 用 来 设置 用 户 登 录 成 功 或 失败 时 分 别 转 问 的 页 面 。 
@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 问 /welcome.asp 页 面 。 
@ 在 “如 采 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 回 /loginfailasp 页 面 。 
完成 后 的 设置 如 图 3-46 所 示 。 

这 两 个 网 页 将 在 后 面 单独 进行 编辑 。 


加 果 登 录 成 功 ， 转 到 |: /welcome. asp | 训 览 . 


| | 转 到 前 一 个 TEL 如 果 它 存在 ) 
加 颗 登 录 具 贮 ， 转 到 |: laginfail. asp| 训 览 .| 


图 3-46 设置 页 面 转 问 


注意 : 
如 果 选 中 “如 果 登 录 成 功 ， 转 到 ” 栏 下 方 的 “ 转 到 前 一 个 URL( 如 果 它 存在 )” 复 选 框 ， 
则 登录 成 功 后 浏览 器 会 回 到 浏览 index.asp 的 前 一 页 。 


“登录 用 户 ” 对 话 框 的 最 后 一 部 分 是 用 来 设置 后 面 设 定 用 户 浏览 权限 所 要 用 到 的 一 些 参 数 。 

@ 选择 “基于 以 下 项 限制 访问 ”后 面 的 “用 户 名 、 密 但 和 访问 级 别 ” 单 选 按钮 ， 设 定 
后 面 将 根据 用 户 的 用 户 名 、 密 码 及 权限 级 别 共 同 决定 其 浏览 网 页 的 权限 。 然 后 从 
“获取 级 别 自 ” 下 拉 列 表 中 选择 Authority 字 段 ， 表 示 根 据 Authority 字 段 的 数字 来 确定 
用 户 的 权限 级 别 。 

完成 后 的 设置 如 图 3-47 所 示 。 
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如 果 登 录 成 功 , 转 到 : [rwelcoe ay | 

回转 到 前 一 个 URL 如果 宮 存 在 ) 
如果 堂 未 失敗 ， 转 到 : |/oginfail. ssp 
基于 以 下 项 限制 访问 : (つう 用 户 名 和 密码 

⑦ 用 户 名 、 密 码 和 访问 级 别 

获 职 级 别 自 : |Authority v 


图 3-47 设置 访问 权限 
通过 以 上 步 缀 完成 设置 工作 。 设 置 完 成 后 的 “登录 用 户 ” 对 话 框 如 图 3-48 所 示 。 注 意 
对 照 检查 。 


从 表单 获 职 输入 : F071 


用 户 名 字段 : Username v 


密码 字段 : |Password v| 
使 用 连接 验证 : | connuser 
表格 : | user 
用 户 名 列 : usernane 加 
密码 列 : | password v| 
し] 转 到 前 一 个 URL( 如 果 它 存在 ) 
如 果 登 录 失败 , 转 到 : /loginfail.asp | 
基于 以 下 项 限制 访问 : 〇 用户 名 和 密码 
名 用 户 名 、 密 码 和 访问 级 别 
获 职级 别 自 : | Auathority 


3-48 ”设置 完成 后 的 “登录 用 户 ” 对 话 框 


设置 完成 后 ， 单 击 “ 确 定 ”按钮 ， 关 闭 该 对 EE 
话 框 ， 返 回 到 “文档 ”窗口 。 在 “服务 器 行为 ”面板 中 增加 守 
了 一 个 “登录 用 户 ” 行 为， 如 图 3-49 所 示 。 

同时 ， 可 以 看 到 表单 对 象 对 应 的 “属性 ”面板 的 
“动作 ”属性 值 为 《<%=MM LoginAction%>， 如 图 3-50 所 示 。 它 
的 作用 天 是 实现 用 户 登 录 功 能 ， 这 是 一 个 Dreamweaver CS5 目 动 
生成 的 动作 对 象 。 

选择 荣 单 栏 上 的 “文件 ”一 “保存 ”命令 ， 
将 该 文档 保存 到 本 地 站 点 中 。 


3-49 “服务 器 行为 ”面板 


动作 [Ginaaetiag | 问 mW の 
方法 mr MM 编 B| っ 


3-50 ”表单 对 应 的 “属性 ”面板 


用 户 管 理 系 统 


当 用 户 输入 的 登录 信息 不 正确 时 ， 切 换 到 loginfail.asp 页 面 ， 显 示 登 录 失 败 的 信息 。 如 > 
果 浏 览 者 输入 的 登录 信息 正确 ， 将 切换 到 welcome.asp 负面， 如 图 3-51 所 示 。 
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图 3-51 登录 成 功 界 面 


本 下 将 完善 登录 功能 页 面 ， 制 作 步 又 如 下 : 

将 制作 的 moban.asp 另存 为 loginfailasp 页 面 ， 并 在 网 页 标题 栏 中 输入 “登录 
失败 ”。 

在 文档 中 修改 布局 效果 ， 并 输入 登录 失败 的 说 明文 学 。 在 “文档 ”窗口 中 选中 
“这 里 ”文本 ， 在 其 对 应 的 “属性 ”面板 中 的 “链接 ”文本 框 中 输入 index.asp， 将 其 设置 为 
指向 index.asp 页 面 链接 。 显 示 用 户 登 录 和 失败 信息 的 loginfail.asp 页 面 如 图 3-52 所 示 。 
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图 3-52 ”登录 失败 页 面 logimfail.asp 
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选择 荣 单 栏 中 的 “文件 ”一 “保存 ”命令 ， 将 该 文档 保存 ， 完 成 oginfail.asp 


页 面 的 创建 。 

将 制作 的 moban.asp 另存 为 welcome.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “ 登 3 
成 功 ”。 

使用 Dreamweaver CSS 中 提供 的 制作 静态 网 页 的 工具 完成 如 图 3-53 所 示 的 静 
态 部 分 。 为 了 测试 登录 系统 的 方便 ， 在 此 只 编辑 了 一 些 简单 的 内 容 。 
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图 3-53 ”登录 成 功 欢迎 界面 的 内 容 


选择 荣 单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 面 板 ， 单 击 该 面板 上 
“二 ”号 投 钮 ， 从 打开 的 某 单 中 选择 “阶段 变量 ”命令 ， 为 网 页 中 定义 一 个 阶段 变量 ， 如 图 
3-54 所 示 。 

此 时 将 打开 “阶段 变量 ”对 话 框 。 在 “名 称 ” 文 本 框 中 输入 “阶段 变量 ”的 名 
称 ee 如 图 3-55 所 示 。 


re ] 
命令 ( 预存 过 程 ) 


请 求 变量 

应 用 程序 变量 
Spry 数据 集 
获 了 数据 源 . 


2 


图 3-54 ”添加 阶段 变量 图 3-55 ”定义 阶段 变量 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定” 按钮， 关闭 该 对 话 框 ， 返 回 到 “ 文 
档 ” 窗 口 。 在 “ 绑 定 ”和 面板 中 ， 将 显示 一 个 动态 数据 对 象 组 Session。 单 击 Session 图 标 左 边 的 


“+” 号 按钮 ， 可 以 查看 所 有 的 阶段 变量 ， 可 以 看 到 ーー ーー 
刚才 定义 的 MM username 显示 在 其 中 ， 如 图 3-56 十 一 交 档 类 型 SF VE3eript 
所 示 。 


在 “文档 ”窗口 中 通过 拖 动 鼠标 选择 
“XXXXXX” 文 本 ， 然 后 在 “ 绑 定 ”面板 中 选择 
MM username 变量 ， 再 单 击 “ 绑 定 ” 面 板 展 部 的 
“插入 ”按钮 插入 ]， 将 其 插入 到 该 “文档 ”窗口 
中 设 定 的 位 置 。 插 入 完毕 ， 可 以 看 到 “XXXXXX” 
文本 被 {Session.MM username} 占 位 符 代 替 ， 如 图 
3-57 所 示 。 这 样 ， 束 完成 了 这 个 显示 登录 用 户 用 户 


回 请 Sessl on 


MM _ sername 


| 
名 阶段 变量 的 添加 工作 。 当 网 页 在 浏览 器 中 显示 Oo 
时 ， 该 阶段 变量 将 被 具体 的 用 户 名 代 符 。 
DW XH RC) 要 看 WY) 其 和 GD 修 权 全 格式 6) 合 $(C) 交点) 全品) 帮助 00 Eo 
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3-57” 绑 定 后 的 效果 


前”! 个 本 地 项 目 铁 渤 中 ,总 共 W051 日吉] 


说 明 : 


以 上 定义 的 阶段 变量 对 当前 站 点 内 所 有 的 网 页 文件 都 是 有 效 的 。 用 户 登 录 成 功 时 ， 服 务 

器 就 为 用 户 建 立 一 个 会 话 变量 ， 在 一 般 情 况 下 ， 为 用 户 提 供 的 大 部 分 功能 都 是 基于 这 个 会 话 

对 象 的 ， 如 果 用 户 浏览 完毕 ， 需 要 退出 时 ， 就 必须 结束 这 个 会 话 变量 ; 否则 ， 有 可 能 造成 用 

户 信息 泄露 。 在 一 般 情 况 下 ， 如 果 用 户 关闭 浏览 器 或 用 户 长 时 间 没 有 操作 以 致 服务 器 就 认为 
用 户 已 经 离开 ， 都 可 以 结束 该 用 户 的 会 话 对 象 。 但 是 ， 不 能 通过 这 两 种 消极 的 方式 来 结束 会 
话 ， 应 该 在 网 页 中 为 用 户 提 供 一 个 积极 的 结束 会 话 。 在 Dreamweaver CSS 中 要 实现 这 种 功能 
很 简单 ， 只 要 通过 “注销 用 户 ” 的 服务 器 行为 就 可 以 了 。 


GE 在 “文档 ”窗口 中 通过 拖 动 鼠标 选中 “注销 用 户 ” 文 本 。 打 开 “ 服 务 占 行为 ” 
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面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 菜单 中 选择 “用 户 身 份 验证 ”命令 ， 从 打开 
的 子 羔 单 中 选择 “注销 用 户 ” 命 令 ， 如 图 3-38 所 示 。 
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3-58 过 拌 “ 注 铺 用 户 ” 疹 令 


打开 “注销 用 户 ” 对 话 框 。 在 该 对 话 框 中 可 为 所 选中 的 文本 添加 一 个 结束 会 话 
的 服务 占 行 为 ， 其 设置 如 下 : 

@ 在 该 对 话 框 中 的 “在 以 下 情况 下 注销 ” 栏 中 选中 “ 单 击 链接 ” 单 选 按钮 ， 单 击 文本 
框 右 侧 的 下 拉 三 角 按 钮 等 ， 在 打开 的 下 拉 列 表 中 选择 “上 所 选 范围 :“ 注 销 用 户 ” 设置 
结束 会 话 动作 的 触发 事件 是 网 页 中 的 “注销 用 户 ” 文 本 被 单 击 。 

@ 在 “在 完成 后 ， 转 到 ”文本 框 中 输入 /logout.asp， 设 置 结束 会 话 后 ， 转 到 ]ogout.asp 页 
面 。 

完成 后 的 设置 如 图 3-59 所 示 。 


在 以 下 情况 下 注销 : 2 单 击 链接 :| 所 选 范围 : “注销 用 户 “ マ 


( 〇 页 面 载 入 


在 完成 后 ， 转 到 : |/1ogout. asp ] 


3-59 ”设置 完成 后 的 “注销 用 尸 ” 对 话 杠 


设置 完成 后 ， 单 击 “ 和 确定” 按钮， 关闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 在 
“服务 器 行为 ”和 面板 中 增加 了 一 个 “注销 用 户 ” 行 为 ， 如 图 3-60 所 示 。 同時, 可以 看 到 “和希 
束 会 话 ” 文 本 链接 对 应 的 “属性 ”和 面板 中 的 “链接 ”属性 值 为 《<%=MM_ Logout %>， 如 图 3-61 
所 示 。 它 是 Dreamweaver CS5 目 动 生成 的 动作 对 象 。 


用 户 管 理 系 统 


动态 开本 [Session. MM username) 


3-60 “服务 咒 行 为 ”面板 


mm x 
RE so 


EE 
le , 
回 区 垂直 他 默认 yl 高 | 20 ”标题 中 


3-61 表单 对 应 的 “属性 ”和 面板 


选择 末日 栏 中 的 “文件 ”一 “你 存 ” 命 令 ， 将 该 文档 保存 到 本 地 站 点 中 。 


于 于 登录 功能 测试 


制作 好 一 个 系统 后 需要 进行 测试 才能 上 传 到 服务 占 进 行使 用 。 下 和 面 束 对 登录 功能 进行 测 
二 其 步骤 如 下 : 


打开 正 浏 览 器 ， 在 地 址 栏 中 输入 htp:V127.0.0.1， 打 开 index.asp 文件 ， 如 图 3-62 所 示 。 
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3-62 ”打开 制作 的 首页 效果 
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完毕 ， 单 击 


在 网 页 的 表单 对 象 的 文本 框 及 密码 框 中 输入 用 户 名 及 密码 ， 输 入 完 


“登录 ” 按 乌 。 
如果 第 二 歩 } 


真 写 的 登录 信息 是 错误 的 ， 则 浏览 右 融 会 转 到 钳 误 信息 显示 页 面 


loginfailasp， 显 示 登 录 钳 误 信 息 ， 如 疼 3-63 所 示 。 
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图 3-63 ”登录 失败 页 面 loginfail.asp 的 显示 效果 


如 朱 输 入 的 用 户 名 和 密码 都 正确 《如 输入 表面 数据 库 中 预先 输入 的 admin )， 


则 转 到 welcome.asp 页 面 ， 显 示 登 录 成 功 信息 。 同 时 ， 网 页 中 将 显示 出 登录 用 户 名 ， 如 图 3-64 
所 示 。 这 是 因为 在 网 页 中 设置 了 名 为 MM username 的 阶段 变量 。 
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图 3-64 ”登录 成 功 页 面 welcome.asp 的 显示 效果 


CE 光 于 用户 管理 系统 


如 果 想 结束 会 话 ， 只 需要 单 击 “ 结 束 会 话 ” 文 本 链接 即 可 。 结 束 会 话 后 ， 
浏览 器 就 会 转 到 页 面 logout.asp〔 该 页 面 需要 事先 设计 静态 的 页 面 效果 )， 向 用 户 显示 出 
结束 会 话 成 功 的 信息 。 这 个 页 面 也 需要 进行 单独 制作 ， 方 法 同 前 面 。 如 果 想 重新 登 
录 ， 只 需要 单 击 “ 这 里 ”文本 链接 ， 就 可 以 转 到 页 面 index.asp， 重 新 登录 ， 如 图 3-65 > 


所 示 。 
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图 3-65 ”结束 会 话 成 功 


到 这 一 步 登录 功能 页 面 就 制作 完成 了 ， 读 者 可 以 根据 目 己 设计 的 网 页 内 容 适 当地 增加 和 
修改 关键 子 段 ， 扩 展 用 户 注 册 的 功能 。 


注册 功能 


一 个 用 户 管理 系统 还 需要 有 注册 新 用 户 的 功能 ， 对 于 新 用 户 来 说 ， 通 过 单 击 index.asp 
页 面 上 的 “注册 新 用 户 ” 文 本 链接 ， 进 入 到 名 为 registerasp 的 页 面 ， 输 入 注册 信息 后 单 击 
“注册 ”按钮 ， 即 可 实现 注册 功能 。 
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registerasp 负面 用 于 新 用 户 注 册 ， 注 册 狐 用 户 的 操作 实质 上 是 问 usermdb 数据 库 中 的 
user 表 中 添加 记录 的 操作 ， 制 作 完 成 后 的 页 和 面 如 图 3-66 所 示 。 

具体 设计 步骤 如 下 : 

将 制作 的 moban.asp 为 存 为 registerasp 页 面 ， 并 在 网 页 标题 栏 中 输入 “用 户 注 册 ”。 

使用 Dreamweaver CSS 中 提供 的 制作 铬 态 网 页 的 工具 完成 如 网 3-67 所 示 的 静 


态 部 分 


O 
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当 用 户 广 栅 incrreTt atornod Esplerer 
宣 芥 一 恒 本 让) 班 而 后 届 本 (ui 工具 条 而 蕴 时 


cer 2 国 回 輸 用 困 大 wm 局 芝 - 划 巨 - 加 上 阻 和 


る EO tg i 


に 名画 首 页 产品 褒 盟 行星 动 壹 应 用 案例 。 联系 我 们 
一 husngla 


> 入 


国画 二 。 议 渡 相生 ”其 子 炳 四 


图 3-66 注册 系统 的 主页 面 样式 
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| 


3-67 register.asp 负面 静态 设计 


注意 : 

为 表单 对 象 命 名 时 ， 由 于 表单 对 象 中 的 内 容 将 被 添加 到 user 表 中 ， 因 此 可 以 设置 表单 对 
象 名 定义 与 数据 表 中 相应 字段 名 称 相同 。 例 如 ， TT (ON SE 名 为 
username， 把 用 于 添加 密码 的 文本 框 命名 为 password 等 。 这 样 做 的 目的 是 ， 当 该 表单 中 的 内 
容 被 添加 到 user 表 中 时 它们 会 自动 配对 ， 即 将 文本 “确认 密码 ”对 应 的 文本 框 命名 为 


passwordl 。 


需要 设置 一 个 验证 表单 的 动作 ， 用 来 检验 浏览 者 在 表单 中 填写 的 内 容 是 售 满 足 
数据 库 中 表 user 中 学 段 的 要 求 。 这 样 ， 在 将 用 户 十 写 的 注册 资料 提交 到 服务 右 之 前 ， 束 会 对 
用 户 填 写 的 资料 进行 验证 。 对 于 不 符合 要 求 的 信息 ， 可 以 同 浏 览 者 显示 错误 的 原因 ， 并 让 浏 


用 戸 管 理系 金 
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史 者 备 狐 输入 。 首 先 选择 制作 页 面 中 的 整个 表单 ， 然 后 选择 亲 蛙 位 中 的 “窗口 ”一 “行为 ” 
命令 ， 打 开 “ 行 为 ”面板 。 单 击 “ 行 为 ”面板 中 的 “+” 按 钮 ， 从 打开 的 “行为 ”列表 中 选 
择 “ 检 查 表 单 ” 命 令 ， 将 打开 “检查 表单 ”对 话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 
@ 议 置 username 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 的 ”;“ 可 接受 ” 选 “ 任 何 东 西 ”， 
即 该 文本 域 必 须 填 写 ， 不 能 为 至 。 
@ 议 置 tuename 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 的 ”“ 可 接受 ” 选 “ 任 何 东 西 ”， 
即 访 文本 域 必 须 填 写 ， 不 能 为 至 。 
@ 设置 password 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 和 需 的 ”;“ 可 接受 ” 选 “ 任 何 东 西 ”， 
即 访 文本 域 必 须 填 写 ， 不 能 为 至 。 
@ 设置 passwordl1 文本 域 的 验证 条 件 “ 值 ”为 :“ 必 和 需 的 ” “可 接受 ” 选 “ 任 何 东 西 ”， 
即 该 文本 域 必 须 填 写 ， 不 能 为 至 。 
设置 email 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 ” 的 ;“ 可 接受 ” 选 “ 电 子 信件 地 址 ”。 
@ 设置 question 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 的 汪 “ 可 接受 ” 选 “ 任 何 东 西 ” 即 
该 文本 域 必 须 填 写 ， 不 能 为 空 。 
@ 设置 answer 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 和 需 的 ” “可 接受 ” 选 “ 任 何 东西 ”有 即 
该 文本 域 必 须 填 写 ， 不 能 为 空 。 
该 动作 完成 后 的 设置 如 图 3-68 所 示 。 


可 接受 : 〇 ”任何 东西 〇 数字 
@@ 电子 邮件 地 址 ”CC) 数字 从 


图 3-68 设置 “检查 表单 ”动作 


设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 返 回 到 “文档 ”窗口 。 在 对 应 的 “标签 检查 
器 ”面板 中 设置 “行为 ”动作 的 触发 事件 为 onSubmit， 表 示 按 下 “提交 ”按钮 则 进行 检测 ， 设 
置 完 成 后 如 图 3-69 所 示 。 


| 属性 | 行为 | 标签 <formy 


以 辣 表 和 童 


图 3-69 设置 “行为 ”动作 
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说 明 : 

在 该 网 页 中 可 以 看 到 设置 了 两 个 填写 密码 的 文本 域 ， 这 样 做 的 目的 是 让 用 户 连 续 两 次 输 
入 密码 内 容 ， 如 果 两 次 密码 一 致 ， 服 务 器 则 接 党 密码。 这样 可 以 避免 用 户 在 输入 密码 时 由 于 
按 错 键 造 成 密码 丢失 。 但 是 ，Dreamweaver CS5 的 验证 表单 动作 没有 提供 检查 密码 一 致 性 的 
功能 ， 还 需要 在 源 代 码 中 加 入 一 段 简单 的 程序 来 实现 这 种 功能 。 


在 “文档 ”窗口 中 单 击 工具 栏 上 的 代码 按钮 贸 病 ， 切换 到 代码 编辑 窗口 ， 然 
后 在 验证 表单 动作 的 源 代码 中 加 入 如 下 代码 : 

if (MM findObj('password').value!=MM findObi(password19.value) errors += '- 两 次 密码 输 
和信 不一致 mr 

修改 后 该 动作 的 源 代 码 如 下 : 


<script type デ "tex1JavaScript "> 

ご !-- 

function MM findObi(n, d) 1 //v4.01 
var p,Lx; 1f(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { 

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} 

if(!(x=d[n])&&d.all) x=d.allln]; for (=0; Ix&&i<d.forms.length;i++) x=d.forms[1 [nj; 
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM findObj(n,d.layers[il.document); 
if(!x && d.getBlementByld) x=d.getElementByld(n); return x: 

} 


function MM validateForm() ! //v4.0 
var 1,p,q,nm,test,num,min,max,errors=",args=MM validateForm.arguments: 
for (1=0; 1<(args.length-2); 1+=3) { test=args[1+2]; val=MM findObj(args[1]); 
if (val) { nm=val.name; if ((val=val.value)!="") { 
if (test.indexOf('1sEmail")!=-1) { p=val.indexOf('(®'); 
if (p<1 | p==(val.length-1)) errors+=- +nm+ .\n'; 
} else if (test!='R') { num = parseFloat(val); 
if (isNaN(val)) errors+='- +nm+' must contain a number. \n'; 
if (test.indexOf('inRange') != -1) { p=test.indexOf(:"; 
min=test.substring(8,p); max 三 test.substring(D 十 1 ): 
if (num<min || max<num) errors+=- '+nm+' must contain a number between ‘+mint+'" and 
‘+maxt+'.\n'; 
} } } else if (test.charAt(0) = 'R') errors +='-'Hnm+'" 需要 输入 .\n'; } 
} 
if (MM findObj('password').value!=MM findObj('password1').value) errors += -两 次 密码 输入 不 一 
致 mi: 
if (errors) alert( 注 册 时 出 现 如 下 错误 :n+errors); 
document.MM return Value = (errors == "); 
} 
//--> 
</script> 


编辑 代码 完成 后 ， 单 击 工具 栏 上 的 设计 按 钢 | 国 说 +{|， 返 回 到 “文档 ”窗口 。 
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此 时 ， 可 以 训 试 一 下 执行 的 效 末 。 两 次 输入 不 同 的 密 人 但， 然后 单 击 “ 确 认 ” 按 钮 ， 捉 区 
表单 中 填写 的 内 容 。 此 时 ， 将 打开 一 个 如 疼 3-70 所 示 的 警告 椎 。 


Microsoft Internet Explorer 区 | OO) 


] 填 与 出 现 如 下 的 错 
1 | ー username 
- password 种 轨 输入. 
ー passwordl 人 


ー truename 布 去 输 
- email 需 雯 轴 上. 
- answer 需 去 输 上 六. 


图 3-70 “提示 错误 


接 下 来 应 该 在 数据 库 中 添加 一 条 用 户 记 录 ， 把 这 些 合格 的 数据 添加 到 这 条 记录 
的 相应 学 段 中 去 。 这 束 害 要 在 该 网 页 中 洪 加 一 个 “插入 记录 ”的 服务 器 行为 。 打 开 “ 服 务 器 
行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 六 早 中 选择 “插入 记录 ”命令 打开 
“插入 记录 ”对 话 框 。 

在 该 对 话 框 中 进行 如 下 设置 : 

@ 从 “连接 ”下 拉 列 表 中 选择 connuser 作 为 数据 源 连 接 对 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 user 作 为 使 用 的 数据 库 表 对 象 。 

@ 在 “搬入 后 ， 转 到 ”文本 框 中 设置 记录 成 功 谍 加 到 表 user 后 ， 切 换 到 megok.asp 网 


页 。 
@ 该 对 话 框 的 下 半 部 分 用 于 将 网 页 中 的 表单 对 象 和 数据 库 中 表 user 中 的 字段 一 一 对 应 起 
来 。 


设置 完成 后 该 对 话 框 如 图 3-71 所 示 。 


连接 : 2DIIrLSeL 本 
质 入 到 表格 :user -| 
插入 后 ， 转 到 : |/regok. asp | 
获取 值 自 : | form | 旺 提 变 时 ) 
表单 元 素 : | RE 人 人 时 | 到 | 中 sername” 
Co 【 


和 Ena 


列 : nsername 
提 变 汐 : | 文本 


图 3-71 设置 完成 后 的 “插入 记录 ”对 话 杠 
设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 
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用 户 名 在 数据 库 表 中 的 关键 字 也 是 用 户 登 录 的 身份 标 六 ， 是 不 能 重复 的 。 所 以 
在 添加 记录 之 前 ， 一 定 要 先 在 数据 库 中 得 找 该 用 户 名 是 人 否 存 在 ， 如 果 存 在 ， 则 不 能 进行 注 
册 。 在 Dreamweaver CSS 中 已 经 提 供 了 一 个 检查 新 用 户 名 的 服务 右 行 为 用 于 实现 该 操作 。 单 
击 “ 服 务 器 行为 ”面板 中 的 “+” 号 按钮 ， 从 打开 的 采 单 中 选择 “用 户 和 映 份 验证 ”一 “ 检 
查 新 用 户 名 ”命令 ， 如 图 3-72 所 示 ， 同 该 网 页 添加 检查 狐 用 户 名 的 服务 此 行为 。 


十 一 人 档 准 型: hSF VEScript 
记录 上 集 ( 查询 ) 
前 侍 


重复 区 域 


记录 集 分 由 
显示 区 域 


动态 贷 本 


持 到 詳細 息 面 
转 刘 相关 页 面 


插入 记录 
更 新 记录 
册 | 际 记录 
动 介 表单 元 素 k 


登录 用 户 
XSLT 转换 限制 对 下 的 态 辐 


2 nia 
新 塞 服 基 器 行 寺 查 新 用 户 ; 
获 职 更 多 服务 器 行 湖 | 


图 3-72 添加 “ 栓 信 新 用 戸 名 ” 的 服 径 笑 行 訪 


此 时 ， 将 打开 一 个 “检查 新 用 户 名 ”对 话 框 ， 在 该 对 话 框 中 进行 如 下 设置 : 

@ 在 “用 户 名 字段 ”下 拉 列 表 中 选择 username 字 段 。 

@ 在 “如 果 已 存在 ， 则 转 到 ”文本 框 中 输入 /regfail.asp。 表 示 如 果 用 户 名 已 经 存在 ， 则 
切换 到 regfail.asp 页 面 ， 显 示 注 册 失 败 信 息 。 该 网 页 将 在 后 面 进行 编辑 。 

设置 完成 后 的 对 话 框 如 图 3-73 所 示 。 


用 户 名 字段 | 


如 果 已 存在 ， 则 转 到 : |/Yegfail. asp 


图 3-73 “ 检 碍 新 用 户 名 ”对 话 框 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 ， 返 回 到 
“文档 ”窗口 。 可 以 看 到 ， 在 “服务 占 行 为 ”和 面板 中 增加 了 一 个 “检查 新 用 户 名 ”行为 ， 
如 图 3-74 所 示 。 

选择 菜单 栏 中 的 “文件 ”一 “保存 ”命令 ， 将 该 文档 保存 到 本 地 站 点 中 ， 完 成 
本 页 的 制作 。 


昌行 


十 一 可 档 关 型 : hsP VBScript 


检查 新 用 户 书 
插入 记录 FOEM "Earm1"] 


3-74 增加 “检查 新 用 户 名 ”行为 


为 了 方便 浏览 者 进行 登录 ， 应 该 在 regok.asp 页 面 中 设置 一 个 切换 到 index.asp 页 面 的 链 
接 对 象 ， 以 方便 用 户 进行 登录 。 同 时 ， 为 了 方便 浏览 者 重新 进行 注册 ， 应 该 在 regfail.asp 页 
面 中 设置 一 个 切换 到 register.asp 页 面 的 链接 对 象 ， 以 方便 用 户 进行 重新 注册 。 

将 制作 的 moban.asp 另存 为 regok.asp 页 面 ， 使 用 Dreamweaver CSS Nk 
制作 静态 网 页 的 工具 完成 如 图 3-75 所 示 的 静态 部 分 。 制作 比较 简单 ， 这 里 不 再 车 述 。 其 中 
“这 里 ”文本 设置 为 指 问 mdex.asp 页 面 的 链接 。 


DW 文件 0) 商人 殿 (0) 春香) 遇 入口 ) 棚 記 人 W) 格式 0O) 会 を て) 站 点 好 ) 倒 口 rj 新生 00 | 深重 < 


に 网 eva v BZA に ESM 
oe wy “OD i 
.i 


图 3-75 注册 成 功 regok.asp 页 面 
如 果 用 户 输 入 的 注册 信息 不 正确 或 用 户 名 已 经 存在 ， 则 应 该 同 用 户 显 示 注 册 失 


败 的 信息 。 这 里 再 新 建 一 个 regfail.asp 页 面 ， 访 页 面 的 设计 如 图 3-76 所 示 。 其 中 “这 里 ” 文 
本 设置 为 指 问 register.asp 负面 的 链接 。 


编辑 工作 完成 后 ， 束 可 以 测试 该 注册 页 面 的 执行 情况 了 。 
打开 正 浏览 器 ， 在 地 址 栏 中 输入 http://127.0.0.1/registerasp， 打 开 registerasp 文 


件 ， 如 图 3-77 所 示 。 
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在 此 可 以 在 该 注册 页 面 中 故意 输入 一 些 不 正确 的 信息 ， 如 漏 填 一 些 username、 
password 等 必 填 字段 ， 或 填写 非法 的 E-mail 地 址 ， 或 在 确认 密码 时 两 次 输入 的 密码 不 一 致 ， 
以 测试 网 页 中 验证 表单 动作 的 执行 情况 。 如 果 填 写 的 信息 不 正确 ， 则 浏览 器 应 该 打开 警告 
框 ， 癌 浏览 者 显示 错误 原因 ， 如 图 3-78 所 示 。 

在 该 注册 页 面 中 注册 一 个 已 经 存在 的 用 户 名 ， 如 输入 “admin”， 用 来 测试 检测 
新 用 户 服 务 器 行为 的 执行 情况 。 然 后 单 击 “ 确 定 ” 按 钮 ， 此 时 由 于 用 户 名 已 经 存在 ， 浏 览 器 
应 目 动 切换 到 regfail.asp 页 面 ， 如 图 3-79 所 示 ， 提 未 浏览 者 该 用 尸 名 已 经 存在 。 此 时 ， 浏 览 
者 可 以 单 击 “这 里 ”文本 链接 ， 返 回 register.asp 页 面 ， 以 便 重 新 进行 注册 。 

在 该 注册 页 面 中 填写 如 图 3-80 所 示 的 正确 注册 信息 ， 然 后 单 击 “确定 ”按钮 。 
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由 于 这 些 注 册 资 料 完 全 正确 且 这 个 用 户 名 没有 重复 。 浏 览 需 应 切换 到 regok.asp 
页 面 ， 向 浏览 者 显示 注册 成 功 的 信息 ， 如 图 3-81 所 示 。 此 时 ， 浏 览 者 可 以 单 击 “这 里 ” 文 
本 链接 ， 切 换 到 index.asp 页 面 ， 以 便 进 行 登 录 。 
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图 3-81 注册 成 功 页 面 显示 
ED 可 以 在 Access 中 打开 用 户 数 据 库 文 件 usermdb， 查 看 其 中 的 user 表 対 象 的 内 
容 。 此 时 可 以 看 到 ， 在 该 表 的 最 后 ， 增 加 了 一 条 新 记录 ， 如 图 3-82 所 示 。 这 条 数据 束 是 刚 
才 在 网 页 register.asp 中 提交 的 注册 用 户 的 信息 。 
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图 3-82” 表 user 中 添加 了 一 条 新 记录 
这 个 实例 是 用 户 管理 系统 的 注册 功能 页 面 的 制作 和 测试 。 通 过 本 节 内 容 的 学 习 ， 谈 者 已 


经 可 以 独立 完成 网 站 的 注册 系统 ， 并 将 其 应 用 到 复杂 的 网 站 系统 中 。 
> 多 球 ゝ 人 已 
资料 修改 与 删除 功能 
一 般 情 况 下 ， 用 户 管 理 系 统 都 应 该 为 用 户 提 供 修 改 注册 资料 的 功能 ， 访 功能 应 包括 用 户 


资料 修改 及 删除 用 户 的 操作 。 实 际 上 ， 人 和 修改 注册 用 户 的 过 程 惑 是 更 新 记录 的 过 程 。 本 节 将 介 
绍 如 何 实现 用 户 资 料 的 修改 及 删除 功能 。 


9 资料 修改 页 面 : 


该 幢 面 主要 是 把 用 户 所 有 资料 疼 了 9 出， 通过 更 新 记录 有 的 命令 实现 制作 。 具 体 的 制作 步 又 如 下 : 


用 户 管 理 系 统 


将 制作 的 moban.asp 另存 为 userupdate.asp 页 面 ， 使 用 Dreamweaver CSS 中 提 
供 的 制作 静态 网 页 的 工具 完成 如 网 3-83 所 示 的 静 恋 部 分 。 
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3-83 userupdate.asp 静态 页 面 
打开 “ 绑 定 ”和 面板 ， 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 末 单 中 选择 “ 记 


录 集 (会 询 )” 命 分 ， 打 开 “ 记 录 集 ”对 话 框 。 
在 该 对 话 杠 中 进行 如 下 设置 


@ 在 “名 称 ” 文 本 框 中 输入 Recordsetl 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connuser 数 据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 user。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 在 “ 炳 选 ” 栏 中 设置 记录 集 过 滤 的 条 件 为 username: =: 阶段 变量 : MM UserName。 


完成 后 的 设置 如 图 3-84 所 示 。 
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图 3-84 定义 记录 集 
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设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 。 返 回 到 “ 文 
档 ” 窗口， 此 时 “ 绑 定 ”面板 中 就 绑 定 了 一 个 Recordsetl 记录 集 ， 如 图 3-8 所 示 。 

然后 将 Recordsetl 记录 集中 的 字段 绑 定 到 页 面 上 相应 的 位 置 。 对 于 网 页 中 的 单 
选 按钮 组 sex 对 象 ， 绑 定 动态 数据 可 以 按照 如 下 方法 ， 单 击 “ 服 务 器 行为 ”面板 中 的 “十 ” 
号 投 钮 ， 从 打开 的 染 单 中 选择 “动态 表单 对 象 ” 一 “动态 单 选 按钮 ”命令 ， 打 开 “ 动 态 单 选 
投 钮 ”对 话 框 。 设 置 动 态 单 选 按钮 组 对 象 。 从 动态 “ 单 选 按钮 组 ”下 拉 列 表 中 选择 forml 表 
单 中 的 单 选 按钮 组 sex。 单 击 “ 选 取 值 等 于 ”文本 框 右面 的 到 按钮 ， 从 打开 的 动态 数据 列表 
框 中 选择 记录 集 Recordset1 中 的 sex 字段 ， 设 置 完成 后 对 话 框 如 图 3-86 所 示 。 

we ts = 


も 一 净 档 类 型 : ASP VBScript G 


改定 
一 了 记录 集 (Recordset1) 
ID 


username 
password 
truename 
sex 
Email 


Question 


hnswer 
Authority 
[第 一 个 记录 ... 
[最 后 一 个 记 ... 
[总 记录 数 ] 


值 : 男 
选 职 值 等 于 : <%= (Recordsetl. Fields.Item("sex" i 


3-85 绑 定 的 记录 集 图 3-86 设置 动态 单 选 按 钮 


用 鼠标 将 数据 绑 定 到 页 面 上 相应 的 位 置 后 ， 页 面 的 显示 如 图 3-87 所 示 。 
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单 击 “服务 右 行 为 ”面板 中 的 “+” 号 按钮 ， 从 打开 的 染 单 中 选择 “更 新 记录 
集 ” 命 令 ， 为 网 页 添加 更 独 记 录 的 服务 右 行 为 。 打 开 “ 更 新 记录 ”对 话 框 。 该 对 话 框 与 插入 
记录 对 话 框 十 分 相似 ， 具 体 的 设置 悄 况 如 图 3-88 所 示 ， 这 里 不 再 资 述 。 


尝 按 ~ 
要 更 新 的 表格 : user wv 
选 职 记录 自 : Rscordss wv 


唯一 键 列 : Tn マッ | | 数值 
在 更 新 后 ， 转 到 :Auaserupdateok. asp 训 览 ... 


获 职 值 自 : | for Y | (在 提 变 时 ) 
表单 元 来 : EE 


sex 更 新 列 | ”sex” 
Fmsi1 更新 列 "Emsi1" 


到 | : username 


提 蛮 为 : 立 本 


图 3-88 “更 新 记录 ”对 话 框 


设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 选 择 
菜单 栏 中 的 “文件 ”一 “保存 ” 命 令 ， 将 该 文档 保存 到 本 地 站 氮 中 。 


注意 : 

由 于 本 页 的 MM username 值 是 来 自 上 一 页 注册 成 功 后 的 用 户 名 值 ， 所 以 单独 测试 将 提 
示 出 错 信息 ， 需 要 先 登 录 后 ， 在 登录 成 功 页 面 中 单 击 “ 修 改 个 人 资料 ”链接 到 该 页 面 才 会 产生 
效果 ， 这 在 后 面 的 测试 实例 中 将 进行 详细 介绍 。 


虽 333 完善 修改 功能 ) 


用 户 修改 注册 资料 成 功 后 ， 应 切换 到 userupdateok.asp 页 面 。 在 该 网 页 中 ， 应 该 癌 用 户 
显示 资料 修改 成 功 的 信息 。 同 时 ， 如 果 用 户 想 继续 修改 资料 ， 则 应 该 为 用 户 提 供 一 个 返回 到 
userupdate.asp 页 面 的 文本 链接 。 如 果 用 户 不 需要 修改 ， 则 应 该 为 用 户 提 供 一 个 切换 到 
welcome.asp 页 面 的 文本 链接 。 为 了 同 用 户 提 供 更 加 友好 的 界面 ， 应 该 在 网 页 中 显示 用 户 修 
改 的 结束 ， 以 提示 用 户 检 得 修改 是 人 否 正 硝 。 

具体 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 userupdateok.asp 页 面 ， 使 用 Dreamweaver CSS 中 
提供 的 制作 毅 态 网 页 的 工具 完成 如 图 3-89 所 示 的 表态 部 分 。 

为 了 回 用 户 提 供 更 加 友好 的 界面 ， 应 该 在 网 页 中 显示 用 户 修 改 的 结 采 ， 以 提示 
用 户 检 答 修改 是 否 正 确 。 为 了 实现 该 目的 ， 首 先 应 该 定义 一 个 记录 集 ， 其 方法 与 制作 
userupdate.asp 页 面 中 定义 记录 集 的 方法 一 样 。 然 后 请 加 记录 集中 的 动态 数据 对 象 ， 把 用 户 修 
改 后 的 信息 显示 在 空白 负面 中 ， 如 图 3-90 所 示 。 
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页 面 ， 这 个 页 面 用 于 实现 删除 用 户 功能 ， 


供 的 制作 藤 态 网 页 的 工具 完成 如 图 3-91 所 示 的 静态 部 分 。 


具体 制作 步骤 如 下 : 
将 制作 的 moban.asp 另存 为 useredelete.asp 页 面 ， 使 用 Dreamweaver CSS 中 提 
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打开 welcome.asp 页 面 ， 首 先 在 welcome.asp 页 面 中 增加 一 个 切换 到 用 户 记录 
删除 页 面 useredelete.asp 的 链接 对 象 ， 输 入 “删除 注册 ”并 在 “属性 ”面板 中 的 “链接 ” 文 
本 框 中 输入 useredelete.asp， 设 置 后 的 welcome.asp 页 面 如 网 3-92 所 示 。 
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议 页 面 上 俩 用 起 者 数据 : 
请 为 读 立 侍 站 嫂 一 个 站点。 
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oy で AivWeid で div newws) うっ 


RE ne “区 这 二 ee ed 
ma E | ser elelatie. usp 


3-92 ”加 入 “删除 注册 ”链接 


切换 到 useredelete.asp 页 面 。 由 于 需要 在 useredelete.asp 页 面 中 显示 用 户 的 注 


册 人 信息， 所 以 应 该 定义 一 个 记录 集 。 其 方法 与 制作 userupdate.asp 页 面 中 定义 记录 集 的 方法 
| 
在 “文档 ”窗口 中 插入 一 个 表单 。 将 鼠标 指针 放置 在 表单 中 ， 选 择 亲 单 栏 中 的 
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“插入 ”一 “表单 ”一 “按钮 ”命令 ， 在 表单 中 插入 一 个 按钮 ， 并 通过 对 应 的 “属性 ”面板 
将 该 表单 中 的 动作 设置 为 “提交 表单 ” 修改 按钮 名 为 “确定 删除 ” 设置 完成 后 的 页 面 如 图 
3-93 所 示 。 


DW 文件 07) 的) 查看 7) 折 和 G) 情 训 人) 格式 如) 命 を 6C) 站 点 45) 全 口 (本 内 0 | 


EAD caisnr, ay nehua es 
it | 1 | RP 人 給 に イ 全 时 入 用 从 得 に 、 に 


電 合 活 
关于 后 后 天 法 侈 复 , 烙 观 二 精囊 吗 ? 
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[REWGE 


图 3-93 ”确定 删除 


打开 “服务 器 行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 沫 单 中 选 
择 “ 删 际 记录 ”命令 ， 将 打开 “删除 记录 ”对 话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 
从 “连接 ”下 拉 列 表 中 选择 connuser 作 为 数据 源 连 接 对 象 。 
从 “从 表格 中 删除 ”下 拉 列 表 中 选择 user 作 为 使 用 的 数据 库 表 对 象 。 
从 “选取 记录 自 ” 下 拉 列 表 中 选择 Recordsetl 记录 集 作 为 要 删除 的 记录 对 象 。 
在 “唯一 键 列 ”下 拉 列 表 中 选择 主键 字段 为 ID 
从 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 form1。 
在 “删除 后 ， 转 到 ”文本 框 中 设置 记录 成 功 删 除 后 ， 切 换 到 /userdeleteok.asp 网 页 。 
设置 完成 后 该 对 话 框 如 图 3-94 所 示 。 
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连接: LOTISe 
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3-94 ”设置 完成 后 的 “删除 记录 ”对 话 框 


用 户 管 理 系 统 


设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 ， 返 回 到 “ 文 梢 ”窗口 。 

由 于 删除 记录 的 操作 是 不 可 换 回 的 ， 为 避免 用 户 误 操 作 应 该 在 页 面 中 设置 让 用 
户 取消 的 功能 。 在 “文档 ”窗口 中 输入 “ 单 击 此 处 取消 结束 会 话 ” 文 本 ， 然 后 设置 该 文本 链 
接 到 welcome.asp 页 面 。 

该 页 面 制 作 完成 后 如 图 3-95 所 示 。 
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3-93 useredelete.asp 页面 


选择 末 单 栏 中 的 “文件 ”一 “保存 ”命令 ， 将 该 文档 你 存 到 本 地 站 点 中 。 
当 用 户 删 除 成 功 后 ， 应 切换 到 成 功 删 除 信息 的 页 面 ， 制 作 删 除 注册 的 静态 网 员 
userdeleteok.asp 效果 如 图 3-96 所 示 。 
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3-96 userdeleteok.asp 静态 页 面 设 计 
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于 资料 修改 与 删除 功能 测试 


编辑 工作 完成 后 ， 需 要 对 资料 修改 的 执行 情况 进行 测试 其 测试 步 怒 如 下 : 

打开 正 浏 览 磺 ， 在 地 址 栏 中 输入 http:/127.0.0.1/ index.asp， 打 开 index.asp 文 
件 。 在 该 页 面 中 输入 登录 信息 ， 登 录 成 功 后 ， 单 击 “ 修 改 您 的 注册 资料 ”链接 文本 ， 切 换 到 
userupdate.asp 外 面 ， 如 图 3-97 所 示 。 


动用 户 注册 一 icrosoft Internet Explorer 
: 立件 ) 编辑 儒 ) 查看 (WW) 收藏 入 ) 工具 (I) 和 玫 助 册 


Om OO EO 暴光 x BE 


; 地 址 Q) 可 http://127.0.0.1/userupdate. asp 


性 别 : @ 等 
电子 邮件 : test@163. com 


_ 密码 提示 问题 : 你 是 谁 ? 
i > + 密码 提示 答案 : [我 是 测试 者 
マミ dg 


留言 本 访谈 焦点 ”天 于 我 们 


图 3-97 ”修改 用 户 注册 资料 
在 该 页 面 中 进行 一 些 修改 ， 这 里 修改 密码 ， 然 后 单 击 “提交 ”按钮 将 修改 结 
友 送 到 服 分 人 器 端 。 当 用 万 足 芝 更新 成功 后 , 渕 覧 益 会 切換 色 userupdateok.asp 页 面 中 ， 显 示 
资料 修改 成 功 的 信息 和 该 用 户 修 改 后 的 资料 信息 ， 并 提供 切换 到 资料 修改 页 面 和 切换 到 主页 
面 的 链接 对 象 ， 如 图 3-98 所 示 。 


汉 用 户 注册 = icroso ft Internet Explorer 
: 文件) ”编辑 下 ) 査 者 V) 収 療 ぬ ) 工具 他 ) 帮助 出 ) 
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+ 地 址 J) | http://127.0.0. 1/userupdateok. asp 


人 Si: test 
:|12 


性 别 : @ A O 多 
电子 邮件 : test@163. com 
密码 提示 问题 : 你 巧 礁 ? 

密码 提示 答案 : 我 是 测试 者 


[RE | 宣告 ) 


图 3-98 更 新 记录 成 功 显示 页 面 
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“删除 注册 ”功能 的 方法 是 : 通过 单 击 “ 登 录 成 功 ” 中 的 “删除 注册 ”命令 进入 删除 页 
面 ， 删 除 注 册 人 信息， 如 网 3-99 所 示 。 


入 注销 用 户 = Nicrosoft Tnternet Explorer 
: 文件 让) 编辑 代 ) 查看 0” 収 立 ぬ ) 工具 て ) 帮助 出) 
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: 地 址 吕 ) 加 http://127.0.0. 1/useredelete. asp v 转 到 
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结束 会 话 
结束 后 将 无 法 恢复 ， 您 确定 结束 吗 ? 
用 户 : 测试 者 | 
密码 : test | 
密码 验证 : test 
真实 姓名 : |12 
、・ 記 性 别 : @ 人 o 本 > 
电子 邮件 : |teste@163.com 
留言 本 访谈 焦点 ”天 于 我 们 密码 提示 问题 : 你 年 从 
密码 提示 管 案 : | 我 症 测 坛 者 
单 击 这 里 取消 结束 会 话 
关于 我 们 | 法 律 声明 | 留言 反馈 | 联系 我 们 | 友情 链接 | 网 站 地 图 


Copyrights @ 2000-20008 FSDSHOF.COM ALL Rights Reserved 
联系 电话 : 010-123456 供 真 : 010-654321 


に <] Internet 


图 3-99 ”删除 页 面 
上 上述 测试 结果 表明 ， 用 户 注册 资料 修改 和 删除 系统 已 经 成 功 制 作 完成 。 


找 回 密码 功能 


在 注册 新 用 户 时 要 求 新 用 户 提供 一 个 问题 和 答案 ， 然 后 利用 这 个 问题 和 答案 帮助 用 户 在 
态 记 秘 公 时 找 回 壮 失 的 密码 。 如 果 用 户 提 供 的 答 采 和 原 管 柔 相同 ， 束 可 以 找 回 壮 失 的 密码 ; 
合 则 ， 无 法 找 回 壮 失 的 密码 。 本 市 将 主要 介绍 如 何 实 现 站 点 中 的 密码 但 询 功 能 。 


3.6.1 
本 小 节制 作 找 回 密码 的 主要 页 面 lostpassword.asp， 有 具体 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 lostpassword.asp 页 面 ， 使 用 Dreamweaver CSS 中 
提供 的 制作 静态 网 页 的 工具 完成 如 网 3-100 所 示 的 静态 部 分 。 

将 输入 用 户 名 的 文本 域 命名 为 inputname。 在 “文档 ”窗口 中 选中 表单 对 象 ， 
然后 在 其 对 应 的 “属性 ”面板 中 ， 在 “表单 ID” 文本 框 中 输入 form1， 在 “动作 ”文本 框 中 
输入 showquestion.asp 作为 该 表单 提交 的 对 象 页 面 。 在 “方法 ”下 拉 列 表 中 选择 “POST” 作 
为 该 表单 的 提交 方式 ， 如 图 3-101 所 示 。 
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3-100 lostpassword.asp 页面 


EE 
和 表单 也 动作 Pe 口 上 标 > 类 @ 
一 方法 PosT 纺 9 关 型 ~ 


3-101 设置 表单 提交 的 动态 属性 
当 用 户 在 lostpassword.asp 页面 中 输入 用 户 名 ， 并 单 击 “提交 ”按钮 后 ， 将 通 
过 表单 将 用 户 名 提交 到 showquestion.asp 负面 中 。 该 页 面 的 作用 束 是 根据 用 户 名 从 数据 库 中 
找到 对 应 记录 的 提示 问题 并 显示 在 showquestion.asp 页 面 中 ， 同 时 请 用 户 输 入 问题 的 答案 。 
将 制作 的 moban.asp 另存 为 showquestion.asp 页 面 ， 使 用 Dreamweaver CS5 中 提供 的 制作 着 
态 网 页 的 工具 完成 如 图 3-102 所 示 的 静态 部 分 。 
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3-102 showquestion.asp 静态 设计 
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在 “文档 ”窗口 中 选中 表单 对 象 ， 然 后 在 其 对 应 的 “属性 ”面板 中 ， 在 “ 动 
作 ” 文 本 框 中 输入 showpassword.asp 作为 该 表单 提交 的 对 象 页 面 。 在 “方法 ”下 拉 菜 单 中 选 
择 “POST” 作 为 该 表单 的 提交 方式 ， 如 图 3-103 所 示 。 接 下 来 将 输入 密码 提示 问题 答案 的 
文本 域 命名 为 inputanswer。 ©) 
打开 “ 绑 定 ”面板 ， 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 菜单 中 选择 “ 记 議 
录 集 (查询 )” 命 令 ， 打 开 “ 记 录 集 ”对 话 框 。 < 


Form1 | 方法 PosT ママ 编码 类 型 | 慰 


| 表单 ID 动作 showpassword. asp | コ 目标 wv 类 人) | news © 


图 3-103 ” 议 置 表单 提交 的 属性 


在 该 对 话 框 中 进行 如 下 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 Recordset1l 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connuser 数 据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 user。 

@ 在 “ 列 ” 选 项 组 中 先 选 择 “ 选 定 的 ” 单 选 按钮 ， 然 后 选择 字段 列表 框 中 的 username 
和 Question 两 个 字段 束 行 了 。 

@ 在 “人 沛 选 ” 栏 中 设置 记录 集 过 滤 的 条 件 为 username: =: 表单 变量 : inputname, 表示 
根据 数据 库 中 username 罕 段 的 内 容 和 从 上 一 个 网 页 中 的 表单 中 的 inputname 表 单 对 有 象 
传递 过 来 的 信息 是 否 完 全 一 致 过 小 记录 对 象 。 

完成 后 的 设置 如 图 3-104 所 示 。 


inputname 


图 3-104 定义 “记录 集 ” 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定” 按钮， 关闭 该 对 话 杠 。 返 回 到 “ 文 
档 ” 和 窗口 。 将 Recordsetl 记录 集中 的 question 字段 绑 定 到 页 面 上 相应 的 位 置 。 

选择 采 单 位 中 的 “插入 ”一 “ 表 蛙 ”一 “隐藏 域 ”命令 ， 在 表 蛙 中 插入 一 个 表 
单 隐 藏 域 ， 然 后 将 该 隐藏 域 的 名 称 设 置 为 username。 


ンー 
ンー 
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选中 该 隐 癜 域 ， 切 换 到 “ 绑 定 ”面板 ， 将 Recordsetl 记录 集中 的 username 字 
段 绑 定 到 该 表单 隐 茂 域 中 ， 如 网 3-105 所 示 。 


| Da 立 鐘 ば] 再 二 ほぼ 奄 三 (Wj 手 入 0) 隆 醒 画 ) 格 写 回 ] 僵 党 忙 ) 末 点 回 ) 。 恒 口 条 町 周 中 i |ー ト El 


上 ET 二 野 | 


| = 
| ms uy ebun. et 二 


| mm 二 - ls 了 本 下 
| 武志 | 曙 员 ,| 襄 计 | 生還 備 則 | 町 骨 下田 。. 栓 章 。、gu 。 标题 : 班 区 站 村 + 一 立正 了 全 ，AEF VRSeript に 


mi 哮 钼 


トト art 


すず 。 回 mmmti 

示 “|[ 烦 一 个 记录 
妆 ”[ 蝇 局 一 个 
妆 。”【 旦 记录 梁 ] 


于 则 ; 沉 案 ] 
i SESE EE: en | 查 汉 在 访 : 
Er | SE 对 天 一 ， 坚 晤 六 的 二 尸 直下 4 订 重 本 这 国 重 机 语 太 
本 : 归 辕 区 司 提 示 避 是 ; 国 
六 和 正确 的 各 案 : | 
馬 種 弄 里 = | 


Em ir rsh 
证 | 聡 率 国 還 加 本 六 | 由 站 绪 国 


Sal pL a FH HE 
障 昌 是 局 二 和 全 全 过 35 殿 軸 


于 
Le | 
是 T 隔 貝 『 袜 件 
に し 呈し ドー WE EF 立 件 
に 了 直立 件 


图 3-105 添加 表单 隐藏 域 


注意 : 
当 用 户 输入 的 用 户 名 不 存在 时 ， 即 记录 集 Recordsetl 为 空 时 ， 就 会 导致 该 页 面 不 能 正常 
显示 ， 这 就 需要 设置 隐藏 区 域 . 


在 “文档 ”窗口 中 选中 当 用 户 输入 用 户 名 存在 时 显示 的 内 容 即 整个 表单 ， 然 后 
单 击 “服务 占 行 为 ”面板 中 的 “+” 号 按钮 ， 从 打开 的 有 亲 单 中 选择 “显示 区 域 ” 一 “如 果 记 
录 集 不 为 容 则 显示 ”命令 ， 打 开 “ 如 果 记 录 集 不 为 容 则 显示 区 域 ”对 话 框 。 在 该 对 话 框 中 选 
择 记录 集 对 象 为 Recordset1。 这 样 上 只 有 当 记 录 集 Recordsetl 不 为 容 时 ， 才 显示 出 来 。 设 置 完 
成 后 ， 单 击 “ 确 定 ” 按 钮 ， 如 图 3-106 所 示 。 关 闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 


天 灯 记 承 集 证 为 空 则 性 示 区 茂 


图 3-106 打开 的 “如 果 记 录 集 不 为 空 则 显示 区 域 ” 对 话 框 


在 网 页 中 编辑 显示 用 户 名 不 存在 时 的 文本 “对 不 起 ， 您 输入 的 用 户 不 存 
在 ! 请 单 击 这 里 重新 输入 ” 并 为 这 些 内 容 设置 一 个 “如 果 记 录 集 为 衬 则 显示 ”隐藏 区域 
服务 器 行为 ， 这 样 当 记 录 集 Recordsetl 为 空 时 ， 显 示 这 些 文本 ， 完 成 后 的 网 页 如 网 3-107 
所 示 。 
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3-107 ”设置 隐藏 区域 


下” 完善 密码 查询 功能 


当 用 户 在 showquestion.asp 负面 中 输入 答案 并 蛙 击 “查询 ”按钮 后 ， 服 务 絮 就 把 用 户 名 
和 密码 提示 问题 答案 提交 到 showpassword.asp 页 面 中 。showpassword.asp 页 面 就 以 用 户 名 和 
密码 提示 问题 答案 作为 参数 ， 然 后 在 数据 库 中 但 找 符合 条 件 的 记录 ， 如 果 找 到 符合 条 件 的 记 
录 ， 则 表明 答案 正确 ， 束 将 密码 显示 在 页 面 中 ; 如 果 找 不 到 符合 条 件 的 记录 ， 则 表明 答案 不 
正确 ， 束 将 显示 错误 信息 ， 并 提醒 用 户 草 独 输 入 ， 最 后 进行 测试 。 

将 制作 的 moban.asp 另存 为 showpassword.asp 页 面 ， 使 用 Dreamweaver CS5 中 
提供 的 制作 静态 网 页 的 工具 完成 如 网 3-108 所 示 的 静态 部 分 。 


DW 文 作 ) 篇 扫 (GE) 查看 7) 押入 ロ ) 疹 選 (MW) 拉 式 ⑪) 合 和 を WE) 站 点 (5 姜 口 人 1) 情動 OO | | 疏 H 且 ”| 中 古 


化 声 | 扒 赴 | 1 一 习 对 化 丧 三世 于 耻 视 田 ， 失 查 ， 多) 忆 、 语 本 


本 
ーー 


里 西 这 出 重 晰 芭 嫂 


中 画 東 。 访 顷 类 届 ”天子 划 们 


甘于 我 们 | 法 建 尖 明 | 留言 反 民 [ 联 系 我 们 | 太 情 癌 提 | 在 直 他 回 
< ーー > 
ZIK TAK WI QR os  - 3 xt55- imE/< WE tes) 
哲 恒 
v | 

(SD 日 本 (5) 


3-108 showpassword.asp 页 面 


-二 


Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


打开 “ 绑 定 ”面板 ， 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 来 单 中 选择 “ 记 

录 集 (查询)” 命 令 ， 打开 “记录 和 集 ” 对 话 杠 。 在 该 对 话 框 中 进行 如 下 设置 : 

在 “名 称 ” 文 本 框 中 输入 Recordsetl 作为 该 记录 和 集 的 名 称 。 
从 “连接 ”下 拉 列 表 中 选择 connuser 数 据 源 连接 对 象 。 
从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 user。 
在 “ 列 ” 选 项 组 中 先 选 择 “ 选 定 的 ” 单 选 按钮 ， 然 后 选择 字段 列表 框 中 的 

Username、Question 和 Answer 三 介 字 段 就 行 了 。 

@ 在 “人 沛 选 ” 柱 中 设置 记录 集 过 小 的 条 件 为 Answer: =: 表单 变量 ; inputanswer, 表示 
根据 数据 库 中 Answer 字 段 的 内 容 和 从 上 一 个 网 页 中 的 表单 中 的 inputanswer 表 单 对 象 
传递 过 来 的 信息 是 否 完全 一 致 过 波 记 录 对 象 。 

完成 的 设置 如 图 3-109 所 示 。 
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3-109 定义 “记录 集 ” 


单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 杠 ， 返 回 到 “文档 ”窗口 。 将 记录 集中 的 
username 和 password 两 个 字段 分 别 添 加 到 网 页 中 ， 如 图 3-110 所 示 。 
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3-110 加 入 的 记录 集 效果 


用 户 管 理 系统 


同样 需要 根据 记录 集 Recordsetl 是 否 为 衬 ， 为 该 网 页 中 的 内 容 设置 隐藏 区 
域 的 服务 器 行为 。 在 “文档 ”窗口 中 选中 当 用 户 输 入 密码 提示 问题 答案 正确 时 显示 的 内 
容 ， 然 后 单 击 “服务 器 行为 ”和 面板 中 的 “+” 号 按钮 ， 从 打开 的 末 单 中 选择 “显示 区 
域 ”一 “如 果 记 录 集 不 为 容 则 显示 ”命令 ， 打 开 “ 如 有 果 记 录 集 不 为 容 则 显示 区 域 ” 对 话 
杠 。 在 该 对 话 框 中 选择 “记录 集 ” 对 象 为 Recordset1。 这 样 ， 只 有 当 记 录 集 Recordsetl 
不 为 空 时 ， 才 显示 出 来 。 设 置 完成 后 ， 单 击 “ 确 定 ” 投 钮 ， 关 财 该 对 话 框 ， 返 回 到 “ 文 
档 ” 窗 口 。 

在 网 页 中 选择 当 用 户 输入 密码 提 示 问 题 答 架 不 正确 时 显示 的 内 容 ， 并 为 这 些 内 
容 设 置 一 个 “如 果 记 录 集 为 空 则 显示 ”隐藏 区 域 服务 器 行为 。 这 样 ， 当 记录 集 Recordsetl 为 
室 時 , 显示 这 些 广 本 3% 

完成 后 的 网 页 如 图 3-111 所 示 。 选 择 采 单位 中 的 “文件 ”一 “保存 ”命令 ， 将 
该 文档 保存 到 本 地 站 点 中 。 
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3-111 完成 后 的 网 页 效果 


到 密码 查询 测试 


将 相关 的 网 页 保存 并 上 传 到 远程 站 点 ， 就 可 以 测试 该 密码 僵 询 的 执行 情况 了 。 

打开 HE 浏览 融 ， 在 地 址 栏 中 输入 http://127.0.0.1 /index.asp， 打 开 index.asp 文 
件 。 单 击 该 页 面 中 的 “ 取 回 密码 ”文本 链接 ， 切 换 到 如 图 3-112 所 示 的 页 面 。 

当 用 户 进 入 密码 查询 页 面 lostpassword.asp 后 ， 输 入 并 向 服务 器 提交 自己 注册 的 
用 户 名 信息 。 当 输入 不 存在 的 用 户 名 ， 并 单 击 “ 提 交 ” 按 钮 后 ， 将 切换 a 到 showquestion.asp 页 
面 ， 该 页 面 将 显示 用 户 名 不 存在 的 错误 信息 ， 并 提供 一 个 切换 到 lostpassword.asp 页 面 的 链接 
对 象 ， 使 用 户 可 以 切换 到 1lostpassword.asp 页面， 并 重 独 输入 用 户 名 。 
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3-112 输入 要 查询 密码 的 用 户 名 


如 果 输 入 一 个 数据 库 中 已 经 存在 的 用 户 名 ， 然 后 单 击 “ 提 交 ” 按 钮 。IB 浏览 
器 将 自动 切换 到 showquestion. asp 页 面 ， 如 图 3-113 所 示 。 下 徊 就 应 该 在 showquestion.asp 页 
面 中 输入 密 公 提示 问题 的 答案 ， 以 测试 showquestion.asp 网 页 的 执行 情况 。 


清查 向 问题 二 icrosoft Internet Explorer 加 回国 
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3-113 showquestion.asp 网 页 


在 这 里 可 以 先 输 入 一 个 错误 的 答案 ， 检 查 showpassword.asp 页 面 中 是 否 能 够 显 

密码 提示 问题 不 正确 时 应 显示 的 错误 信息 。 

如 果 在 showquestion.asp 网 页 中 输入 正确 的 答案 ， 并 单 击 “查询 ”按钮 后 ， 浏 
时 右 将 切换 到 showpassword.asp 页 面 ， 并 显示 出 该 用 户 的 密码 ， 如 图 3-114 所 示 。 
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3-114 showpassword.asp 多面 


上 述 测 试 结 末 表明 ， 密 人 码 便 询 功 能 已 经 成 功 制作 完成 。 到 这 里 ， 用 户 礼 理 系统 的 第 用 功 
能 都 已 经 设计 并 测试 成 功 。 
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章 主要 介绍 如 何在 网 站 中 建设 留言 


板 系统 。 利 用 留言 板 ， 可 以 为 访问 网 站 的 
用 户 提 供 友 言 的 机 会 ， 让 他 们 及 时 准确 地 
发 表 目 己 的 观点 。 留 言 板 主要 用 到 了 创建 
存储 讨论 区 有 关 信 息 的 数据 库 、 议 定 
DSN、 定 义 站 点 、 创 建 数 据 库 连接 、 制 作 
ON cen 
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本 章 的 实例 效果 


ルル 


教学 重点 


搭建 留言 板 管理 系统 开发 平台 に 
留言 板 系 统 的 规划 に ご 

留言 板 的 动态 网 面 设 计 に 

罗列 留言 动态 网 页 开发 に 

于 台 管 理 功能 的 设计 名 

留言 板 系统 测试 ビッ 
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| 搭建 留言 板 管理 系统 开发 平台 


留言 板 管理 系统 对 于 交互 型 的 大 型 网 站 是 非常 重要 的 ， 一 个 网 站 拥有 了 留言 板 功能 之 
后 ， 就 能 够 实现 访问 者 和 管理 者 之 间 的 沟通 。 本 章 选 择 了 一 个 以 留言 板 为 主要 功能 的 餐饮 网 
站 实例 ， 效 果 如 图 4-1 所 示 。 
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图 4-1 留言 板 功能 的 实例 效果 
建立 本 实例 的 开发 平台 需要 使 用 Photoshop 分 制图 请 ， 配 置 HS 站 氮 浏览， 建立 本 实例 


的 站 点 chap04， 使 用 div+CSS 布局 静态 页 面 。 


2 由 使 用 Photoshop CS5 分 割 图 片 


下 面 就 开始 用 Photoshop CS5 切片 工具 分 割 首页 图 片 。 

目 先 在 本 地 计算 机 D 盘 建 立 站 点 文件 夹 chap04， 在 站 点 文件 夹 中 建立 第 用 文 
件 夹 (如 css、images、psd 文件 夹 )， 如 图 4-2 所 示 。 然 后 从 光盘 里 找到 站 点 chap04/psd 文 
件 夹 下 的 index.psd 文件 ， 将 其 复制 到 本 地 站 点 的 psd 文件 夹 中 。 
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も 将 这 个 文件 夹 发 布 到 


请 共享 此 文件 夹 
3 以 电子 邮件 形式 发 送 
该 文件 夹 内 的 交 件 

XK 珊 除 这 个 文件 来 


4-2 ”建立 站 点 文件 夹 


司 动 Photoshop CS5， 选 择 亲 单 栏 中 的 “文件 ”一 “打开 ”命令 ,打开 首 页 


index.psd 文件 ， 可 切 厂 的 效果 如 图 4-3 所 示 。 
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4-3 首页 的 可 切片 效果 

ET3) 在 图 层 上 关闭 一 些 可 链接 的 说 明文 字 ， 按 下 《Ctrl+H 组 合 键 ， 打 开 辅 助 线 视 

图 ， 先 用 辅助 线 分 割 好 需要 分 制 的 区 域 ， 然 后 按照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 14 个 
小 图 片 ， 如 图 4-4 所 示 。 


Ps 国 国 回 ・ ss・ 画 ・ 加 

ET TT 潜 還 1] 本 園 Ivl 站 打上 Ni 

ト by ”| 口 有 二 :| 三 二 | 口 昌和 件 下 二 二 地 电 让 | 到 等 竺 中 給電 | 車 
| 


mtur st tm Ww » En 


二 | 本 一 一 香 


pMNT NN で ロ ィ 


者 而 大 | 天 


可 型 | 六 加 
De 
*・ ロ ーー a 。 
[| 


| 一 


4-4 整个 衣 页 分 割 后 的 效 末 


选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “が 散 ” 模式 , 
“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 4-5 所 示 。 

GEH5) 单 击 “ 储 在” 按钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 “ 保 存在 ” 右 侧 
的 下 拉 三 角 按钮 ”， 在 下 拉 列 表 中 选择 建立 的 chap04 文件 夹 ， 其 他 参数 保持 默认 值 ， 设 置 如 


の 
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图 4-6 所 示 。 
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fon? 
a | 
“享受 生 抽 

享受 了 藉 尖 的 食物 ” 


a 


om il = XS sw Wiit pha2s 十 记过 制 slpz 素 引 。 5 人 ~ 


4-5 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “ 傈 存 ” 按 钮 ， 完 成 保存 页 面 的 操作 。 打 开 你 存 文 件 的 路 径 ， 可 以 看 到 月 
动 生成 了 一 个 名 为 images 的 文件 来。 文件 夹 中 是 页 面 分 割 后 的 小 图 片 ， 由 这 些小 图 片 组 成 
了 和 页 的 效果 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 4-7 所 示 。 


将 优化 结果 存 情 为 
保存 在 ): | chapo4 v| ③ 他 二 | 


Ea 并 醒 品 了 工具 在 ) 時 男前 


我 最 近 的 文档 “器 i 

. [em 
加 

桌面 

; | 到 伯 征爾 必 基 


| 一 条件 
硬 本 这 个 过 全 下 生 有 


生 
el 共 训 此 训导 喜 


立件 名 ): index. html 
保存 美 型 で ): jmL 和 図 像 Gt.html) 取消 
设置 : 默认 设置 
切片 : 选中 的 切片 
4-6 “将 优化 结果 存储 为 ”对 话 框 设置 4-7 分 割 后 的 小 图 片 


2 配置 系统 站 点 服务 器 


接 下 来 使 用 IS 在 本 地 计算 机 上 构建 留言 板 管理 系统 的 站 点 。 
配置 系统 站 操 服务 天 的 步骤 如 下 : 


第 4 童 @EL EA 


首先 启动 IIS, 在 IHS 窗口 中 右键 单 击 “默认 网 站 ”选择 菜单 中 的 “属性 ” 命 
令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 4-8 所 示 。 

单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 站 点 文件 夹 路 径 为 
“D:chap04” 其 他 参数 保持 默认 值 ， 设 置 如 图 4-9 所 示 。 


网 站 。 |ISAPI 第 选 器 | 主 目录 | 文档 “| 目录 安全 性 | TTP 头 | 自 定义 错误 | 『 头 自 定义 错误 ASP.NET ba 
et 网 站 ISAPI 第 选 器 主 目录 | ”文档 目录 安全 性 “| 


a === 连接 友 院 源 时 的 内 容 来 源 

Mt ©): Sa _| 人 @ 此 计算 机 上 的 目录 四 ) 

IP 地 志 ): (全部 未 分 配 ) v 〇 另 一 台 计 算 机 上 的 共享 8) 

TCP 端口 (T): 80 | | 〇 重 定 向 到 URL⑪) 
本 地 牙 径 C): ID:Mhap4 


口 脚 本 资源 访问 で) 口 记录 访问 QW) 
连接 超时 QD: | 秒 回 读 取 四 索引 资源 上 ) 


口 写 入 
保持 HTTP 连接 K) 品目 Sg (E) 


回 息 用 日 志 记 录 ) 一 EEE = 
口 | 口 
活动 日 志 格 式 の : 应 用 程序 名 如 : 。。 芋 认 应 用 程序 | Me 
W3C 扩展 日 志 立 件 格式 | [属性 )... 开始 位 置 : 伍 认 网 站 > 
L | G)... 
- [RE® 


执行 权限 到) : 印 脚 本 
应 用 程序 保护 如: 中 (共用 ) 


图 4-8 “默认 网 站 属性 ”对 话 杠 图 4-9 设置 网 站 的 “本 地 路 径 ” 


单 击 “ 人 确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 设置 ， 由 于 前 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 TE 浏览 右 在 地 址 
位 中 输入 http:/127.0.0.1， 即 可 打开 页 面 分 割 后 的 效 末 。 如 采 可 以 浏览 到 Photoshop CS5 分 割 
后 的 网 页 效果 ， 说 明 站 点 服务 右 的 配置 已 经 完成 。 


4.1.3 创建 编辑 站 点 chap04 


使 用 Dreamweaver CS5 进行 网 页 布局 设计 时 ， 首 先 需 要 使 用 定义 站 点 问 导 定义 站 点 ， 具 
体 的 操作 步骤 如 下 : 

打开 Dreamweaver CS5， 选 择 菜 单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 
4 生理 点 ”对 话 框 。 

早 击 右边 的 “ 狐 建 ”按钮 ， 从 弹出 的 下 拉 麻 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ” 对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ” chap04。 

“本 地 站 点 文件 夹 ” Di\chap0 小 。 

如 图 4-10 所 示 。 

早 击 “分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 右 名 称 ”: chap04。 

“连接 方法 ” 本 地 /网 络 。 

“服务 占 文 件 夹 ” Di\chap04\。 

“ Web URL”: http://127.0.0.1。 


ー | 
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配置 后 的 “测试 服务 右 ” 的 参数 设置 如 网 4-11 所 示 。 


站 点 设置 对 和 锣 chap04 


Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweawyer 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文 件 的 计算 机 上 的 本 地 文件 
版 本 控制 夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 到 web 上 的 服务 器 上 的 远程 文件 夹 。 


* ”高 级 设置 


您 可 以 在 此 处 当 Dreamweayer 站 点 选择 本 地 立 件 来 和 名 称 。 
站 点 名 各 
本 地 站 点 文件 来; 白 


图 4-10 ”定义 站 点 


站 点 设置 对 和 锣 chap04 
站 点 -一 一 一 一 二 
服 科 回 EE 
版 本 控制 服务 器 名 称 :cm | 
* ”高 级 设置 
连接 方法 ; | 本 地 /网络 i 
服务 器 文件 赤 ; [Da ”| 同 
WebURL [httpWlz7ol | 


4-11 设置 “服务 器 ”参数 


单 击 “确定 ”按钮 ， 完 成 站 点 的 定义 设置 。 在 Dreamweaver CS5 中 已 经 拥有 了 
刚才 所 设置 的 站 点 。 


于 证 yiviCSS 布 局 网 页 


实例 静态 网 页 部 分 使 用 div+CSS 布局 设计 实现 ， 整 体 的 页 面 布局 规划 设计 如 图 4-12 


所 示 。 
使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 ASP 文档 格式 ， 


将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


EE 二 斑 還 留言 板 系统 
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图 4-12 页 面 整 体 布局 设计 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>// 宣 告 为 ASP 文档 

<IDOCTYPE html PUBLIC "-/W3C/DID XHTML 1.0 Transitional/EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link re ビ "stylesheet' hre 仁 "css/style.css" type="text/css" /> 

<title> 留 言 系统 </title> 

</head> 


其 他 div 的 布局 代码 如 下 : 


<body> 
<div id="top "> 
<div 1d="logo"></div> 


<div 1d="banner"> 
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<div class="banner1 "> 

<a href="# が > 主 页 </a> | <a hre 全 "#> 注 册 </a> | <a href="# が > 登 录 </a> | <a hre 伟 "如 > 网 
站 地 图 </a> | ”<a hre 伍 "#"> 收 藏 本 站 </a></div> 

<div class="banner2"> 


<a hre 伍 "/index.asp"> 自 ”页 </a> <a hre 伍 "/InsertMessage.asp"> 我 要 留言 </a> 
<a href="/ListMessage.asp"> 查 看 留言 </a> <a hre 伍 "/Admin.asp"> 后 人 台 管 理 </a> 
<a hre 伍 "#"> 关 于 我 们 </a></div> 
</div> 
</div> 


<div id="mid"> 
<div 1d="enjoy"><1mg src="/images/index 03.g1f"></div> 
<div 1d= "news"><lmg src デ "71mages/index 04.gif"></div> 
<div id="nei"> 


一 1 


<div class="nei"> 

<a hre 伍 "#"> 为 了 迎接 五 一 劳动 入 ， 公 司 优惠 打折 活动 ! </a> 

<a hre 全 ="#"> 下 周一 全 体 员 工 在 会 议 室 开会 ， 请 互相 转告 ! </a></div> 
</div> 
<div 1d= "tu"><lmg src="/images/index 06.g1f"></div> 
<div id="tuijian"><img src="/images/index 07.gif"></div> 


<div 1d="ming"> 
<div id="tul "><img src="/1mages/index 08.gif"></div> 
<div id="tu2"><img src="/1mages/index 09.g1f"></div> 
<div id="tu3 "><img src="/1mages/index 10.g1f"><7div> 
</div> 
<div 1id="card"><img src="/images/index 11.gif"></div> 
<div id="dian"><img src="/images/index 12.g1f"></div> 
<div id="server"><img src="/images/index 13.gif"></div> 
</div> 
<div id="bottom"> 
<div id="copyright"><img src="/images/index 14.gif"></div> 
</div> 
</body> 
</html> 


div 布局 完成 后 需要 将 该 页 面 保存 ， 选 择 滋 单 栏 中 的 “文件 ”一 “另存 为 ” 命 
令 ， 打开“ 另存 为 ”对 话 框 ， 在 “文件 名 ”文本 框 中 输入 文件 名 为 “index.asp”， 和 单 击 选择 
“保存 类 型 ”后 面 的 下 拉 三 角 按钮 ， 在 打开 的 下 拉 列 表 中 选择 Active Server Pages (*.asp; 
*.asa) 来 单项 ， 如 图 4-13 所 示 。 单 击 “ 保 存 ” 投 钮 完成 首页 的 布局 设计 。 

在 站 点 中 建立 css 文件 夹 ， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


/# 整 体 页 面 css*/ 
*{ margin:Opx; 


padding:OpX;} 
body{ width: 100%; 
height: 100%; 


ee 6 留言 板 系统 


文件 名 ) : index. asp 保存 (8) 


ww 
保存 类 型 7): Server Fages (*. asp ;水 . asa) wv 取消 


图 4-13 “ 态 存 为 ”对 话 框 设 置 


font-size: 12px; 
background-color:#fdecc7: 


} 
な 设置 所 有 图 片 的 边框 为 0*/ 
img { 
border:0;} 
な 设置 最 外 层 居 中 显示 ， 实 现 让 整个 页 面 居 中 显示 */ 
#top,#mid,#bottom{ 


margin: auto; 
width: 1000px: 

} 
a:link { 
color: #000000; 
text-decoration: none; 
} 
a:visited { 
text-decoration: none; 
color:#fff: 
} 
a:hover { 
text-decoration: underhne: 
color:#C77B32; 
} 
a:active { 
text-decoration: none; 
color: #000000; 
1 
な 设置 左 浮 动 的 标签 */ 
#logo,#banner,#enjoy,#fnews,#nei, 
#tu,#tuijian,#ming,#tul が tn2.#tu3, 
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#card,#dian,#server{ float:left:\ 
/*top 部 分 
#logo{ width:206px: 
height:126px: 
background-image:url(/1mages/index 01.gt):! 
#banner{ width:794px: 
height:126px: 
background-image:url(1mages/index 02.gif):) 
.bannerl 1 width:270px: 
height:16px: 
margin-left:475px; 
margin-top:20px; 
color:#8d4f06; 
) 
.bannerl a:hnk { 
color: が 000000: 
text-decoration: none: 
} 
.bannerl a:visited { 
text-decoration: none: 
color:#8d4f006; 
} 
.bannerl a:hover { 
text-decoration: underhne: 
color:#FFF:; 
} 
.bannerl a:active { 
text-decoration: none; 
color: #000000; 
} 
.banner21 width:630px: 
height:30px: 
margin-left:8Spx; 
margin-top:23px; 
font-size: 18px; color:#FFF;} 
/*mid 部 分 */ 
#mid 1 background-image:url(/1images/backcolor.gt): 
) 
#ne11 width:451px: 
height:103px: 
background-image:url(/1mages/index 05.gif); 
) 
.nel{ width:300px: 
height:35px: 
margin-left:120px: 
margin-top: 1 Spx; 
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Ine-height:20px: 
color:#FFF;t 

#book{ 
margin-left: 120px; 
margin-top: 15px; 
margin-bottom:20px; 
Ine-height:30px: 

} 


制作 完成 后 在 下 浏览 右 中 的 显示 效果 如 图 4-14 所 示 。 
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图 4-14 ”制作 完成 的 首页 效果 
将 首页 的 中 间 部 分 删除 ， 另 存 为 moban.asp 作为 二 级 页 面 ， 如 图 4-15 所 示 。 


rT 蝙 昼 mi 看 看 "0 東 麗 品 ! rr 悪 還 画 
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图 4-15 ”制作 的 三 级 页 面 效果 


Section 


留言 板 系 统 规划 


本 节 将 介绍 留言 板 系 统 的 规划 设计 和 数据 库 设计 ， 主 要 包括 创建 留言 板 数 据 库 、 设 定 系 
完 DSN 和 创建 数据 库 连 接 等 环 市 。 
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| 系统 规划 设计 


首先 对 留言 板 登 录 系 统 押 需要 的 页 面 结构 作 一 个 大 体 的 规划 。 要 利用 页 面 完成 留言 板 的 
功能 ， 需 要 一 个 页 面 来 为 用 户 提供 进入 留言 板 的 入 口 ， 通 背包 含 指 癌 发 言 页 面 的 链接 和 指 问 
租 看 留言 的 链接 ;还 需要 一 个 页 面 用 来 允许 用 户 输入 和 递交 留言 ， 最 后 ， 还 要 设计 一 个 页 面 
显示 留言 。 所 以 ， 访 留言 板 系统 主要 由 以 下 一 些 动态 网 页 构成 。 

@ index.asp: 提供 进入 留言 板 的 主页 。 

InsertMessage.asp: 用 户 发 言 的 页 面 。 
ListMessage.asp: 主题 列表 页 面 。 
ShowMessage.asp: 显示 留言 内 容 的 页 面 。 
Admin.asp: 用 于 登录 后 台 管 理 的 页 面 。 
DeleteMessage.asp: 选择 删除 多 余 的 留言 页 面 。 
Deleteok.asp: 删除 多 余 留 言 的 页 面 。 


リコ 数 据 護 疫 計 ) 


留言 板 的 制作 秆 要 设计 存储 发 言 用 户 资料 的 数据 库 文 件 和 用 于 后 台 登 录 管理 留言 板 的 用 
户 信息 数据 库 文 件 。 要 在 数据 库 中 保存 用 户 的 留言 信息 ， 需 要 设计 以 下 一 些 内 容 : 留言 人 姓 
名 、 留 言 时 间 、 留 言 人 的 联系 地 址 (通常 是 e-mail 地 址 )、 留 言 主 题 和 留言 内 容 。 要 在 数据 
库 中 另 创建 一 个 数据 表 用 于 后 从 登录 管理 使 用 ， 主 要 有 用 户 名 和 密码 就 可 以 。 

留言 板 数据 库 的 设计 步骤 如 下 : 

首先 要 设计 数据 库 的 罕 段 标准 ， 可 以 在 数据 库 中 采用 如 表 4-1 所 示 的 字段 。 这 
里 用 于 存储 留言 资料 的 数据 表 的 名 称 是 Message。 

表 4-1 Message 数据 的 字段 设计 


项 目 字段 名 称 数据 类 型 字段 大 小 必 填 字段 人 允许 空 字符 串 索 3 引 
主题 编号 ID 自动 编号 长 整 型 有 “无 重复 ) 
发 言 人 姓名 author 文本 20 是 合 の 
留言 主题 subject 文本 100 是 省 无 
日 期 和 时 间 time 文本 20 是 十 无 
邮箱 地 址 email 文本 50 从 是 天 
留言 内 容 content 备注 长 整 型 否 是 无 


用 于 存储 后 人 台 管 理 用 户 的 数据 表 名 称 是 Admin。 可 以 在 数据 库 中 采用 如 表 4-2 


所 示 的 字段 。 
表 4-2 Admin 数据 的 字段 设计 
项 目 字段 名 称 数据 类 型 字段 大 人 小 必 寺 字 段 允许 军 字 符 串 索 引 
主题 编号 ID 目 动 编号 长 整 型 有 “无 重复 ) 
后 台 登 录 姓 名 Admin 文本 20 の 合 无 
后 台 登 录 密 但 Password 文本 20 是 と 无 


留言 板 系 统 


注意 : 

Admin 数据 字段 名 称 的 用 户 名 及 密码 是 可 以 任意 修改 的 ， 在 网 站 建设 初期 ， 可 以 将 初始 
值 均 设置 为 Admin， 这 样 匈 于 测试 操作 ， 在 上 传 到 服务 器 进行 使 用 时 ， 请 把 用 户 名 和 密码 设 
置 成 自己 的 用 户 名 和 窗 码 。 


首先 运行 Microsoft Access 2007 程序 。 单 击 “ 空 白 数据 库 ” 按 钮 岂 |， 在 主 界面 
的 右 侧 打开 “ 衬 白 数据 库 ” 面 板 ， 如 图 4-16 所 示 。 单 击 “ 空 日 数据 库 ” 面 板 上 的 “浏览 到 
某 个 位 置 来 存放 数据 库 ” 按 钮 芒 ， 打 开 “ 文 件 新 建 数 据 库 ” 对 话 框 。 


‘3) の - で 2 Microso ft Access 


| 开始 人 佑 历 croso 开 OU1pce Access 


A gpg | BS ms 
レ ] PV1sshwdbtsbop 


国 5 heywdbtshap 


BP EE 
に で 3 0 し 1 に 
ph 
9, 


区 但 年 2007 Microtoft Office tyetem 
的 这 程 中 厅 职 是 条 站 二 

*# Access 2007 丑 户 玉 本 指南 

> 合用 六 侣 多 和 和 号 欢 硬 沪 记 挫折 有 有 对 傅 


4-16 打電 “空白 数 据 麻 "面板 


在 “保存 位 置 ” 后 面 的 下 拉 列 表 框 中 选择 前 面 创建 站 点 chap04 中 的 data 文件 
夹 ， 在 “文件 名 ”文本 框 中 输入 文件 名 message， 为 了 让 创建 的 数据 库 能 被 通用 ， 在 “保存 
类 型 ”下 拉 列 表 框 中 选择 “Microsoft Office Access 2000 数据 库 ” 选 项 ， 如 图 4-17 所 示 。 


文件 基建 丈 扣 上 谎 


4-17 “文件 新 建 数据 库 ” 对 话 杠 
单 击 “ 确 定 ” 投 钮 ， 返 回 “ 衬 日 数据 库 ” 面 板 ， 再 单 击 “ 宇 日 数据 库 ” 和 面板 中 
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的 “创建 ”按钮 ， 即 在 Microsoft Access 中 创建 了 一 个 message.mdb 数据 库 文 件 ， 同 时 
Microsoft Access 目 动 默认 生成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 如 图 4-18 所 示 。 


(9) 人 - 和 工具 TBSEa ロ を : 数据 库 [Access 2000 六 性 司机 | = Mieres_, 
= 一 天 拘 他 证。 計 通 下呂 。 浅 训 本 工 只。 可 或 胡 


sz 国 開 = 電信 | 到手 
| rit a 前 阅 列 ーー 格式 | 


吉本 1 


图 4-18 创建 的 默认 数据 表 


右键 单 击 “ 表 1: 表 ”， 打 开 快 捷 末 和 蛙 ， 选 择 快 捷 末 竺 中 的 “设计 视图 ” 命 
令 ， 打 开 “ 为 存 为 ”对 话 框 ， 在 对 话 框 中 的 “ 表 名 称 ” 文 本 框 中 输入 数据 表 名 称 message， 如 
图 4-19 所 示 。 


表 名 称 幼 : 


确定 取消 


4-19 “另存 为 ”对 话 框 
单 击 “ 确 定 ” 按 钮 ， 系 统 将 自动 打开 创建 好 的 message 数据 表 ， 如 图 4-20 所 示 。 


[= 」 き 层面。 rssane: 数据 村 [Arcess UI 误 性 档 妃 | = Micrcsoft AFrts ー 四 更 
~ 到 滑 。 問 是 。 対 配 酸 琶 。 請 狂 工員 襄 1 


四 ・-1 a 下 点 茜 3 デコ 
EL 
上 時 a 硬 唱 竹 机” 重 3 
柱 惠 工 風 


iT 
记 有 三 = | mg 四 
Mr dt = | 半 民 大 新 融 据 类 型 说 明 | 
习 mesage: 副 ka | 自动 蝙 号 国 
| Ea je 
ET 
字 租 本 小 に ーー | 
号 重 FT | 
格式 
上 | 可 [无 重山) 
看 膳 际 过 
ーー ニー 幸 隐 名 际 最 质 可 本 4 沾 于 和 | 包 于 三 隔 |， 六 
况 率 对 齐 常规 F1 好 可 查看 有 有 关 李 隐 各 标的 相 风 。 
| | 
EE | 


4-20 建立 的 message 数据 表 


留言 板 系 统 


按 表 4-1 输入 各 字段 的 名 称 并 设置 其 相应 属性 ， 结 末 如 图 4-21 所 示 。 


国 message 


字段 名 称 | 数据 类 型 说 明 ー 
¥ |ID 自动 编号 園 
sub ject 文 本 
author 文 本 
email 文本 
time 日 期 /时间 
备注 


‘content 


自动 输入 到 该 字段 中 、 作 为 新 记录 的 值 


图 4-21 创建 表 的 字段 


说 明 : 
其 中 time 字段 用 于 保存 留言 被 存 入 数据 库 的 时 间 ， 可 以 在 Access 中 ， 将 其 默认 值 设 置 
为 “Now0”， 如 图 4-21 所 示 。 这 样 每 当 记 录 被 保存 时 ， 都 会 自动 计算 出 正确 的 时 间 。 


编辑 完成 ， 单 击 “ 保 存 ” 按 钮 加 ， 完 成 message 数据 表 的 创建 。 
同 歩 張 ②ー⑨, 介 建 数 据 表 Admin， 创 建 的 数据 表 如 图 4-22 所 示 。 


Ps 回 の で = 表 工 具 Admin - Microsoft Access ニー 2 xX 
i ー。。 = 
中 | 开始 | 创建 ”外 部 数据 。” ”数据 库 工具 数据 表 @ - mx 
EN 4 风 | 加 = FPF | 的 薪 刍 转 简 
BZ z) 1 ーー 莹 简 转 竹 
视图 | 莫 贴 板 | 字体 | 格式 文本 | 记录 | A* | 自选 器 调 莹 至 切换 窗口 ”查找 
| A Y 路 简 繁 转换 
マ Bd ェ | | | 有 窗 体 大 小 r 
视图 | | | | 排序 和 税 选 窗口 | 中文 简 繁 转换 
表 マ < ID ~ Admin ・|Password ・ 族 學 話 学 産 
Admin 1 admin admin 
コ 米 (新建 ) 
message 
记录 :4 * 第 1 項 ( 共 1 項 ) "Hs | 浆 无 篇 选 占 || 搜索 
"数据 表 ” 视 图 | 数字 | 川 回 | 昌 | 此 | 铝 慨 


4-22 创建 Admin 数据 表 
最 后 ， 关 闭 Access 2007 软件 。 至 此 数据 库 建 立 完毕 。 


在 数据 库 创 建 完成 后 ， 需 要 在 Dreamweaver 中 建立 数据 源 连接 对 象 ， 才 能 在 动态 网 页 中 
使 用 这 个 数据 库 文件 。 有 具体 连接 步骤 如 下 : 

依 次 単 市 “ 控 制 面板 ”ー “管理 工具 ”ー “数 据 源 (ODBCJ ”一 “系统 
DSN” 逃 項 本 , 打 井 “ODBC 数据 源 管 理 器 ”的 “系统 DSN” 选 项 卡 ， 如 图 4-23 所 示 。 
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单 击 “ 添 加 (D)” 按 钮 ， 打 开 “ 创 建新 数据 源 ” 对 话 框 ， 在 “创建 新 数据 
源 ” 对 话 杠 中， 选择 Driver do Microsoft Access (*.mdb) 选项 ， 如 图 4-24 所 示 。 


を 10DBC 数据 源 管 理 腕 


用 户 DSH 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
选择 你 相 为 其 安 ; 动 程 
系统 数据 源 ): 选择 您 想 涛 其 安装 数据 源 的 驱动 程序 (3) 


驱动 程序 


Driver da Microsoft para arquivos texto [x*. 
Driver do Microsoft dBase ([*. dbf) 
Driver do Microsoft Excel tt. xls) 
Driver do Microsoft Paradox (*.db ) 
Driver para o Microsoft Visual FoxFro 
Microsoft Access riyer (*.mdb) 
Microsoft Access-Treiber [*.mdb) 
dBase Driver [*. dbf) 
ase VFF Driver (x. dbf) 


アデ ・ *~ 


图 4-23 “ODBC 数据 源 管 理 研 ”中 的 图 4-24 “创建 新 数据 产 ” 对 话 框 
“系统 DSN” 选 项 卡 
单 击 “完成 ”按钮 ， 打开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 
源 名 (N)” 文 本 框 中 输入 dsnmessage， 如 图 4-25 所 示 。 


ODBC Hicrosoft ACCESS rE 
数据 着 省 六 ): 

说 明 血 ): 

数据 库 


数据 库 : Hitchapn4tdataimassage. mdb 
选择 总 1.. . | 创建 中 | 修复 RE)... 上 庄 泻 业 )， . | 
素 半 数 括 库 


* 元忠) 
『 誤 指 座 還 ): 


Ei 选项 (> | 


图 4-25 “ODBC Microsoft Access 安装 ”对 话 框 


单 击 “ 选 择 〈《S)” 按 钮 ， 打 开 “ 选 择 数据 库 ” 对 话 框 ， 单 击 “ 驱 动 器 〈V)” 
文本 框 右 侧 的 下 拉 三 角 按钮 品 ， 从 下 拉 列 表 框 中 找到 在 创建 数据 库 步骤 中 数据 库 所 在 的 盘 
符 ， 在 “目录 (D)” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 左上 方 “ 数 
据 麻 名 (A)” 选 项 组 中 的 数据 库 文 件 message.mdb， 则 数据 库 名 称 目 动 添加 到 “数据 库 名 
CA)” 下 方 的 文本 框 中 ， 如 图 4-26 所 示 。 

找到 数据 库 后 ， 单 击 “ 人 确定 ”按钮 回 到 “ODBC Microsoft Access 安 装 ” 対生 
框 中 ， 再 次 单 击 “ 确 定 ” 按 钮 ， 将 返回 到 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 选 项 
卡 ， 可 以 看 到 “系统 数据 源 ” 中 已 经 添加 了 一 个 名 称 为 “dsnmessage” 驶 动 程 序 为 “Driver 
do Microsoft Access 〈*.mdb)” 的 系统 数据 源 ， 如 图 4-27 所 示 。 
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10DBC 数据 源 管理 回 
用 户 DSH 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系统 数据 源 (3): 


数据 库 名 &) 目录 ⑪) : 
[message. mdb d: ‘chapDd\data 


message. mdb 


立件 美 型 T): 红 动 器 Y): 
IAccess 数据 库 人 fr. me | | d: 新吉 巻 ”| 


图 4-26 ”选择 数据 库 图 4-27 添加 系统 数据 源 后 的 “系统 
DSN” 选 项 卡 


再 次 单 击 “确定 ”按钮 ， 完 成 “ODBC 数据 源 管理 器 ”中 “系统 DSN” 的 
设置 。 

局 动 Dreamweaver CS5, 打 井 前 面 制作 的 index.asp 静态 页 面 。 在 Dreamweaver 
软件 中 执行 菜单 中 的 “文件 ”一 “窗口 ”一 “数据 库 ” 命 令 ， 打 开 “ 数 据 库 ” 面 板 ， 如 图 4-28 
所 示 。 

单 击 “ 数 据 库 ” 面 板 中 的 [天 按钮 ， 弹 出 如 图 4-29 所 示 的 菜单 ， 选 择 “ 数 据 源 
名 称 (DSN)” 选 项 。 


新 共 库 “| 硕 杰 志 关 | 病 二 关系 行 二 
本 t 衝 時 行 放 


直 一 立 折 美 型 - 店 F VWEScript 


若 雪 在 该 册 和 面 上 司 用 动态 数据 : 
we 1 汶 语 亲人 忻 章 建 站 点 。 
wv 选择 一 种 立 档 尖 型 。 


we 。 3. 设置 站 点 的 测试 服 莹 器 。 
4. i + 按钮 创建 这 


目 定 忌 壹 接 字 桂 审 
汰 所 六 名 称 (DS) 


图 4-28 “数据 库 ” 面 板 图 4-29 ”选择 “数据 源 名 称 (DSN) ”选项 


打开 “数据 源 名 称 (DSN )” 对 话 框 ， 在 “连接 名 称 ” 文 本 框 中 输入 
coonmessage， 单 击 “ 数 据 源 名 称 (DSN)” 下 拉 列 表 框 右 侧 的 下 拉 三 角 按 钮 名， 从 打开 的 数 
据 源 名 称 (DSN) 下 拉 列 表 中 选择 dsnmessage， 其 他 保持 默认 值 ， 如 图 4-30 所 示 。 

在 “数据 源 名 称 CDSN)7” 页 面 中 ， 单 击 “ 确 定 ” 按 钮 后 完成 此 步骤 。 此 时 在 
“数据 库 ” 面 板 中 的 内 容 应 如 网 4-31 所 示 。 

在 网 站 根 目录 下 将 自动 创建 一 个 名 为 Connections 的 文件 来， 该 文件 夹 内 有 一 
个 名 为 coonmessage.asp 的 文件 ， 它 可 以 用 记事 本 打开 ， 内 容 如 图 4-32 所 示 。 


-< の 
ッ ン スニ 
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数据 源 名 称 (D5NH) 


连接 名 称 : 
数据 源 名 称 (DSH): dsnmessage 


用 戸 名 : 」 ーー 

密码 : ] 

reamweayer 应 连接 : 〇 使 用 测试 服务 器 上 的 DSH 
〇 使 用 本 地 DSH 


图 4-30 ”选择 数据 源 名 称 


E COONMESSAEE 一 记事 本 

文件 你 ) 编辑 下 ) 格式 Q) 查看 QM 帮助 0) 

くる へ 
" FileName="Connection odbc conn_dsn.htm" 
' Type="ADO" 

' DesigntimeType=""ADO" 

' HTTP="false" 

' Catalog="""" 

' Schema="'" 

Dim Hl coonmessage_ STRING 

HM coonmessage STRING = "dsn=dsnmessage;" 
る > 


十 一 其 档 尖 型 : hsF VWESeript ( さ 


图 4-31 设置 的 数据 库 图 4-32 上 自 効 生 成 的 coonmessage.asp 文件 


实例 中 还 有 用 于 后 台 管 理 的 数据 表 Admin.mdb 需要 进行 连接 ， 在 制作 的 时 候 
为 了 区 分 连接 ， 我 们 将 单独 建立 一 个 coon 的 DSN 连接 ， 设 置 如 图 4-33 所 示 。 


数 据 江 名 和弥 (IDSJ) 


连接 名 称 : com 
数据 源 名 称 DSN) ET 
用 户 名 : | | 
密码 : | 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSH 
〇 使 用 本 地 DSH 


图 4-33 设置 coon 后 台 管 理 连接 


单 击 “ 人 确定 ”按钮 ， 完 成 数据 库 连 接 。 此 时 的 “数据 库 ” 面 板 如 图 4-34 所 示 。 


慧 蕉 库 


:+ 一 站 档 类 型 : EF VWEScript で 


a 


I caommessage 


图 4-34 建立 的 两 个 数据 表 连 接 对 和 象 


留言 板 系 统 


制作 留言 板 的 动态 功能 页 面 ， 首 先 需 要 制作 用 户 发 言 的 页 面 InsertMessage.asp、 主 题 列 
表 页 面 ListMessage.asp、 显 示 留 言 内 容 的 页 面 ShowMessage.asp， 本 贡 将 介绍 如 何 完 成 这 些 
动态 功能 页 面 的 设计 与 制作 。 


用 户 留 言 的 功能 主要 在 InputMessage.asp 页面 中 进行 ， 在 该 页 面 中 ， 提 供 多 个 文本 框 表 
单 对 象 ， 人 允许 用 户 在 其 中 输入 留言 ， 当 用 户 单 击 “ 提 交 ” 按 钮 时 ， 实 际 上 就 已 经 将 记录 添加 
到 数据 库 中 。 

插入 留言 页 面 的 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 InsertMessage.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “ 插 


入 页 ”。 在 文档 中 修改 布局 效果 ， 插 入 表单 及 文本 域 ， 完 成 的 硬 态 页 面 效 末 如 图 4-35 所 示 。 


DN 文人) 的 必 0) 查看 tm 押入 T) 档 汉 人 振 式 0) 合 售 多) 站 点 人 5 全 口 T) 情動 OO | | 
cai faer Nr vip ー 


NM | 拱 娄 | 设计 | 。 本 由 作 人 ゆ 。 し て 須玉 用 。、 失 本 ん. や ご 回) 到 ハ 本 
站 全 地 直 [ 


basges 


oto Wp 


€ * 
hdr> Cdivias DD i vibsek> Cfare> p> [ie om -1T4 5 T7112 な PGR) 


| <> mm | 宙 式 ) 入 各 | v 7 EE Mf 拓 ) 
bh CN 项 加 元 マッ 证 这 人 Y 已 HR 
| 頁 遇 潤 性 .. | 


< > 
1 个 让 浪 项 日 实 这 让， 马 并 383 
【本 


4-35 ”插入 页 面 的 硬 态 部 分 效果 


注意 : 

在 为 表单 对 象 命 名 时 ， 由 于 表单 对 象 中 的 内 容 已 经 被 添加 到 Message 表 中 ， 可 以 将 表单 
对 象 名 命名 为 与 域 相应 字段 名 称 相 同 。 例 如 ， 将 用 于 添加 主题 的 文本 框 命 名 为 subject， 把 用 
于 发 言 内 容 的 文本 域 命名 为 content 等 。 这 样 做 的 目的 是 当 该 表单 中 的 内 容 被 添加 到 Message 
表 中 时 它们 会 自动 配对 。 

还 需要 设置 一 个 验证 表单 的 动作 ， 用 来 检验 浏览 者 在 表单 中 其 与 的 内 容 是 合 满 
足 数 据 库 中 表 Message 中 字段 的 要 求 。 这 样 ， 在 将 用 户 填 写 的 注册 资料 提交 到 服务 器 之 前 ， 
会 对 用 户 填 写 的 资料 进行 验证 。 如 果 有 不 符合 要 求 的 信息 ， 将 同 浏览 者 显示 错误 的 原因 ， 并 
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要 求 浏览 者 重新 输入 。 


选 定 “提交 ”按钮 ， 选 择 菜单 栏 中 的 “窗口 ”一 “行为 ”命令 ， 将 打开 “ 行 
为 ”面板 。 单 击 “ 行 为 ”面板 中 的 “+” 按 钮 ， 从 弹出 的 行为 列表 中 选择 “检查 表单 ” 合 


令 ， 添 加 验证 表单 的 动作 ， 将 弹出 “检查 表单 ”对 话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 


e 设置 subject 文 本 域 的 验证 条 件 :“ 值 ”为 “必需 的 ””“ 可 接受 ” 选 “ 任 何 东 西 ”。 


@ 设置 author 文 本 域 的 验证 条 件 :“ 值 ”为 “必需 的 ”; 


“可 接受 ” 选 “ 任 何 东西 ”。 


e 设置 email 文 本 域 的 验证 条 件 :“ 值 ”为 “必需 的 “可 按 受 ” 选 “电子 好 件 地 址 ” 表 


示 必 须 输 入 电子 信箱 地 址 。 
该 动作 完成 后 的 设置 如 图 4-36 所 示 。 


mm 


- - 
input “subjec 
input "anthnr" 

1 1 [Ri = 


值 : 必需 的 


可 接受 局 性 何 东 西 中 数字 
② 电子 邮件 地 址 口 数字 从 | | 


图 4-36 设置 “检查 表单 ”动作 对 话 框 


设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 返 回 到 
“文档 ”窗口 。 在 对 应 的 “标签 检查 器 ”面板 中 设置 “ 行 
为 ”动作 的 触发 事件 为 onClick， 如 图 4-37 所 示 。 

接 下 来 应 该 在 数据 库 中 添加 一 条 用 户 记 录 ， 
把 这 些 合格 的 数据 添加 到 这 条 记录 的 相应 的 字段 中 去 。 选 
择 荣 单 栏 中 的 “窗口 ”一 “服务 器 行为 ”命令 ， 打 开 “ 服 
务 器 行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 弹出 


的 菜单 中 选择 “插入 记录 ”命令 ， 将 打开 “插入 记录 ”对 


话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 


_ 
| 属性 | 行为 标签 nput» 


-= ST 
I 到 


| 
E li el 


图 4-37 设置“ 行为 ”的 触发 动作 


@ 从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 作 为 数据 源 连接 对 象 。 
@ 从 “插入 到 表格 ”下 拉 列 表 框 中 选择 Message 作 为 使 用 的 数据 库 表 对 象 。 
@ 在 “插入 后 ， 转 到 ”文本 框 中 设置 肥 言 添加 到 表 Message 后 ， 跳 转 到 ListMessage.asp 网 


页 。 


~ 


@ 该 对 话 框 的 下 半 部 分 用 于 将 网 页 中 的 表单 对 象 和 数据 库 中 表 Message 中 的 字段 一 一 对 


设置 完成 后 该 对 话 框 如 图 4-38 所 示 。 


插入 到 | 表格: message v 
插入 后 ， 转 到 : 浏览 


获取 值 自 : に 回 (在 提 变 时 ) 
表单 元 素 : tk st UL ドロ 3 _ (本) 


いい 
ema1 31 押入 名 軸 中 人 RC 区 本 ) 
contermt 插 六 划 列 中 ”content” (让 本 ) 


me 。 避 
提 交 丸文 本 v 


4-38 设置 完成 后 的 “插入 记录 ”对 话 杠 
说 明 : 
在 上 面 的 操作 中 ， 没 有 提供 添加 “发 言 时 间 ” 的 入 口 ， 这 是 因为 发 言 时 间 是 由 Access 
数据 库 根 据 记 录 被 保存 的 时 刻 自 行 计 算出 来 的 ， 这 主要 通过 指定 Message 表 的 DateTime 字 
段 的 默认 值 来 实现 。 


设置 完成 后 ， 单 击 “ 确 定 ” 投 钮 ， 完 成 该 页 和 的 制作 。 


开 咏 明史 列 留言 列表 


罗列 页 面 是 用 来 显示 所 有 的 留言 主题 列表 的 页 和 面 。 当 网 页 浏览 者 想 浏 览 留言 时 ， 可 以 单 
击 “ 查 看 留言 ”文本 链接 ， 从 而 打开 ListMessage.asp 页 面 浏 览 所 有 的 留言 。 

罗列 页 面 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 ListMessage.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “ 罗 
列 ”。 在 文档 中 修改 布局 效 末 ， 完 成 的 静态 页 面 效 末 如 网 4-39 所 示 。 


DW 文件 (7) 病人 改 G) 坦 着 {Y) 插入 (I) 请 充 侣 ) 格式 名 ) 合 補 WE) 站 点 (5 曽 口 W) 情動 OO | 一 
| ** 


ED ernessutr wu styie ess 
EE 
> つ 9 个 地址 


图 4-39 ListMessage.asp 毅 态 页 面 设 计 
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选择 菜单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 面 板 ， 单 击 该 面板 中 
的 “+” 号 按钮 ， 从 弹出 的 菜单 中 选择 “记录 集 〈 碍 询 )” 命 令 ， 打 开 “ 记 录 集 ”对 话 框 。 在 
该 对 话 框 中 进行 如 下 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 rsMessage 作 为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 数 据 源 连接 对 象 。 
从 “表格 ”下 拉 列 表 杠 中， 选择 使 用 的 数据 库 表 对 象 为 message。 
在 “ 列 ” 选 项 组 中 先 选 择 “ 选 定 的 ” 单 选 按钮 ， 然 后 从 下 面 的 字段 列表 框 中 选择 
ID、subject、anthor 和 time 字 段 。 
@ 在 “排序 ” 栏 中 设置 “time” 字 段 的 内 容 对 记录 集中 的 记录 进行 “降序 ”排列 ， 也 

瓯 是 将 最 新 发 表 的 留言 内 容 排列 在 最 前 面 。 

完成 后 的 设置 如 图 4-40 所 示 。 


名 称 所 で 
连接 : | coonmessage ーー 
表格 : 

列 : 〇 全 部 。 ② 选 定 的 : 


email 


content 
筛选 : 无 | := 
排序 


4-40 定义 “记录 集 ” 参 数 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 返 回 到 “文档 ”窗口 。 
将 Recordsetl 记录 集中 的 字段 绑 定 到 页 面 上 相应 的 位 置 ， 效 末 如 网 4-41 所 示 。 


DW 文 #f 的 必 0E) 論者 (Y) 手 入 (I) 博识 介 ) 格式 t0) 春分 多 ) 站 直人 5 間口 着 风 0M) | | 


相声 | 村人 潮 | 过 if | 示 時 代 央 に イ 。 和 本 後田 」 給 査 に に 、 に 
© 分 地址 


Oooocoooococoocoocoocoooococoocoooccoocoocooocooooooooocooooooooocooooccooooocoococcoocoooocoooooooooccoococoocoocooooooooco 


き 一 HB mc 
We ir> Wi vani 12 Mi IT | 1 M 2 


| <> mw | 梢 式 中) 无 v 7 本 汪 圭 雪 标题 0) | 
bh GS HU) boek * 是 口 。 目标 可 


RE] 


BB BHM: 2011-5-8 10:05 


4-41 绑 定 数据 


留言 板 系 统 


在 “文档 ”窗口 中 拖 忠 鼠标 选择 表格 的 第 2 行 。 单 击 “ 服 务 器 行为 ”面板 中 的 
加 号 “+” 按 钮 ， 从 弹出 的 下 拉 玉 单 中 选择 “重复 区 域 ” 命 令 ， 打 开 “ 重 复 区 域 ” 对 话 框 。 
在 “重复 区 域 ” 对 话 框 的 “记录 集 ” 下 拉 列 表 中 选择 rsMessage 记录 集 。 在 
”区 域 ， 设 置 在 一 rn is 8 条 记录 ， 如 图 4-42 所 示 。 
为 了 浏览 者 浏览 时 导航 方便 ， 还 需要 在 网 页 的 最 后 设置 一 个 动态 记录 导航 。 在 
该 文档 中 分 别 输入 “首页 入 “上 一 页 条 > “最 后 页 ”等 文本 字样 。 
通过 拖 电 岂 标 ， 选 中 “首页 ”文字 。 “服务 器 行为 ”面板 中 的 加 号 “十 
按钮 ， 从 弹出 的 下 拉 菜 单 中 选择 菜单 栏 “ 记 录 集 分 页 ”一 “ 移 至 第 一 条 记录 ”命令 ， 在 “ 移 至 
一 条 记录 ”对 话 框 中 的 “记录 和 集 ” F 拉 列表 框 中 选择 rsMessage 记录 集 ， 如 图 4-43 所 示 。 


移 至 第 一 条 记录 


链接 名 "首页 


记录 集 ; 


4-42 “重复 区 域 ”对 话 框 4-43 设置 首页 的 链接 命令 


通过 同样 的 方法 为 “上 一 页 入 “下 一 页 和 “最 后 页 ”文本 字样 添加 相应 的 服务 
亏 行 为 ， 添 加 导航 栏 后 的 效 末 如 图 4-44 所 示 。 


中 WwW 文件 1] 该 己 (1) 毒舌 (Y) 手 入 (I) 塘 冯 人 榨 式 名 ) 命 を (C) 站 点 45? 曽 口 W) 靖 動 OO lx™| 


EHD ene oo iyile. ess 
状 绩 | 措 雪 | @it 天 村 代 張 に イ 。 全 交 補 田邊 本 &』 に 、 


IB3 
人 va GD AS CT hy |N の ロコ ho /和 WE GL) 


英 元 v B77 ほぼ び 数 
Y ひ の HR 
le 时 元 格 。 水 平 总 ) 取 入 Y 自如 不 暴行 彻 [| 表示 語 &)| ,| 
1 六 便意 ① i x 高 ⑪ 村 量 ) に | 


图 4-44 ”添加 导航 栏 


通过 拖 电 鼠 标 ， 选 中 “首页 ”文本 。 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+ 


按钮 ， 从 弹出 的 下 拉 菜 单 中 选择 染 单 栏 中 的 “显示 区 域 ” 一 “如 条 不 是 第 一 条 记录 则 显示 区 
域 ” 命 令 。 在 “如 末 不 是 第 一 条 记录 则 显示 区 域 ” 对 话 框 中 的 “记录 集 ” 下 拉 列 表 框 中 选择 


rsMessage 记录 集 ， 如 图 4-43 所 示 。 


图 4-45 设置 显示 命令 


通过 同样 的 方法 为 “上 一 页 ”、 
务 帮 行为 。 设 症 显 示 和 隐 史 区域 后 的 效果 如 图 4-46 所 示 。 


“下 一 页 ”和 “最 后 页 文本 字样 添加 相应 的 服 


DN 文人) 病人 改 G) 奏者 (Y) 插入 (I) 请 训 人 ) 拉 式 0) 合 補 人 C) 站 点 人 5 全 口 0D 情動 OO | 
Listossage se x 

SN ornessutr wu style. ess 

し : 3 为 


4 代 M | 基 分 51 | 。 友 時 代 全 に 全 站 视图 人 本 を 、 信 


に っ 4 


ressage, rubject 作弄 wetbcri 
D 蜂 対人 寺 ま 付 骨 叶 示 5 事 条 る さ 千 を 倒 骨 各 志 


ren Las 
は わたす 1 と 254: 


“| 四 了 EE 上 
“9O HR 
FAG RR 0) [| 
| 


ご や の 
x 高 00 


时 元 村 ホキ) Wu 
口 北 EL 


4-46 ”设置 显示 和 隐藏 区 域 


接 下 来 还 需 
“现在 显示 的 是 第 X- 第 Y 条 记录， 共有 AN 条 记录 ”， 


训 昌 村 蕊 此 条 上 媳 天 是 矛 


x 


记 好 生 (rwMectagw) 

和 加 区 域 (sessxze) 

ih 4 

动 志文 本 Gestege. tcbject) 
EN (rsWwwtsew wwar) 

动 达 文本 (rwssasw. isel 

名 时 不 是 第 一 条 忆 妾 炸 | 显示 (restagwl 
物 圣 泣 一 名 记 好 6aexzsage) 

如 里 元 刍 末 不 为 王刚 监 示 (rdWecksg 
移 对 前 一 条 记录 GaMetsskei 

加 时 志和 妆 归 不 为 王 则 显示 rtessepe) 
萝 对 下 一 亲 记 录 wisnen} 

护 尘 不 是 第 后 一 条 记过 央 显示 rsssaen) 
其 荡 到 币 启 一 亲 认 录 (frstuze) 


Ceametti ens 
ci 
dts 
basacer 
pst 
] Mmin. ws 
Deleleleiens 
了 了 了 Lestec ssp 
tndex esp 


要 制作 一 个 计数 器。 将 鼠标 指针 放 症 在 记录 表格 的 前 面 ， 输 入 文本 
如 图 4-47 所 示 。 


DN 文件 7] 访 提 (1) 查 着 (7) 押入 ロ ) 情 届 加) 拉 式 0) 命定 多 ) 站 点 人 5 全 口 (1) 義 動 OO | 
ListWessage axpe x 

EDD 導い UE 

ia PH 人 KM | そ Rm 補欠 欄 に ら 、 个 


打 項 srwgw rayject| rssrags. wrtbcri 
宏章 村 世上 寺 专 储 则 因 于 所 果 订 全 计 训 他 介 是 直 


frieszsgs Yims) 


加 车 河 蕊 寻 训 体 央 | 岛 未 各 黑 神 全 疆 条 杂 关 是 诉 


マ Br 至 择 埋 让 标题 5 
"9O HR 


4-47 制作 计数 需 


ET 一 


记 好 和 业 (rwMectagr) 

重大 区域 (sassxze) 

黎 到 FY 抽 页面 

hE Cestege. tcbject) 
EN (rsWwwtsegw wwar) 

动 达 文本 Gresiiags. isel 

加 尘 不 是 第 一 亲 忆 巡 其 显示 Wiessner) 
徐 芋 端 一 条 记 录 (raMetsskei 

如 里 志 妾 末 不 为 王刚 监 未 (rdWecksgl 
萝 圣 前 一 条 记录 GaMetssgei 

加 时 志和 妆 归 不 为 王 则 时 水 Treeape) 
积 对 下 一 条 记录 raMetssge) 

护 畦 不 是 第 后 一 条 记 当 出 显示 spssen) 
以 动 利生 后 一 未 记 女 (rsWwssxzs) 


て eeeti ens 
は 11 
dts 
ET 
prt 
)、 Mmin. ssp 
Beletllesias 
Blatack asp 
tndex esp 


留言 板 系 统 


用 鼠标 选中 “X”， 在 数据 “ 绑 定 ”面板 中 展开 rsMessage 记录 集 ， 选 择 [ 第 一 
个 记录 索引 ]， 然 后 单 击 “ 插 入 ”按钮 ， 则 “X” 字 样 被 {rsMessage frst! 占 位 符 代替 。 

在 “文档 ”窗口 中 选择 “Y” 有 字样。 在 数据 绑 定 面板 中 选择 [最 后 一 个 记录 过 
引 ]， 然 后 单 击 “ 插 入 ”按钮 ， 在 “文档 ”窗口 中 选择 “N” 了 字样 。 在 数据 绑 定 面板 中 选择 
[总 记录 数 ]， 然 后 单 击 “插入 ”按钮 。 

绑 定 后 ， 计 数 亏 中 的 文本 和 占 位 符 如 图 4-48 所 示 。 
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4-48 创建 计数 需 后 的 “文档 ”窗口 


还 需要 在 网 页 中 设置 一 个 链接 对 象 ， 使 浏览 者 能 够 转 到 /ShowMessage.asp 页 面 
中 和 查看 详细 的 留言 。 选 中 主题 下 的 frsMessage.subjecftj 作 为 链接 ， 然 后 单 击 “ 服 务 器 行为 ” 面 
板 中 的 加 号 “+” 按 钮 ， 从 弹出 的 下 拉 有 来 单 中 选择 “ 转 到 评 细 页 面 ” 命 令 ， 则 打开 “ 转 到 详 
细 页 ”对 话 框 。 

单 击 打开 “链接 ”下 拉 列 表 框 ， 从 中 选择 应 用 “ 转 到 详细 页 面 ”服务 器 行为 的 
链接 。 在 “详细 信息 页 ”文本 框 中 输入 细节 页 的 路 径 和 文件 名 /ShowMessage.asp。 在 “传递 
URL 参数 ”文本 框 中 输入 ID ， 表 示 通 知 该 文件 以 参数 ID 作为 用 户 传递 记录 的 依据 ， 服 务 器 
根据 ID 的 值 癌 用 户 传递 其 选 定 的 记录 。 打 开 “ 列 ”下 拉 列 表 框 ， 从 中 选择 传递 URL 参数 所 
对 应 的 字段 名 称 ID, 如 図 4-49 所 示 。 


链接 : | 所 选 范围 : “<%= (rsMessage.Fis1, W 
详细 信息 页 : /Showhlessage. asp 


传递 URL 参数 : ID ”设置 为 以 下 项 的 值 


记录 集 rslesssee 着 


到 |: Im 图 
传递 现 有 参数 : | ] umr 参数 
[| 表单 参数 


4-49 “ 转 到 详细 页 面 ” 对 话 框 设 置 


ー ビデ 」 
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选择 菜单 栏 中 的 “文件 ”一 “保存 ”命令 ， 你 存 修改 后 的 文档 即 完 成 本 页 面 的 
制作 。 


显示 现 有 留言 的 详细 内 容 主 要 是 在 ShowMessage.asp 页 面 中 实现 的 ， 单 击 罗列 页 后 链接 
到 该 页 面 中 ， 并 显示 详细 的 留言 信息 。 

制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 ShowMessage.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 
“显示 ” 在 文档 中 修改 布局 效果 ， 完 成 后 的 静态 页 面 效 果 如 图 4-50 所 示 。 其 中 “返回 留言 
列表 ”链接 的 是 ListMessage.asp 页 面 。 


[Dw 文件 (F) 编辑 FEF) 查看 (VW) 插入 (I) 修 改 W) 格式 (0) 命令 (C) 站 点 (3) 窗口 (PY) 番 助 O | | 设计 器 v 区 时 


eSSaEe. asD 


YY || 本 地 视图 w 
名 C538 个 WY 色 名 | 


到 
类 型 
文件 夹 “| 
文件 来 | 
eg Rah . 文件 来 
1 gh 5 a . 、 1 后 t 県 2 a 8 に 2 served + a 立 件 来 EL 
联系 电话 : 010-123456 传真 : 010-123458 マ 国 本 文件 严 
< 四 -后 : 文件 夹 
<body> <diviimid> <divibook> DQ 100% vy|748 x 455v| 72 K/ 2 秒 | 简体 中 文 (582312)| | 0 加 立 件 来 
3KB ASF 文件 一 
«> HTML 格式 UF) v BI 放 $= eMessag. .. 12KB ASF 立件 
此 css ID (I) too “Uy a 目标 (6) Deletook ss 4EB ASF 文件 
ndex. a 


D 2KB ASF 文件 
页 面 属 性 ... 列表 项 目 1 i a 
文件 活 臣 己 売 成 。 


4-50 ShowMessage.asp 静态 页 面议 计 


选择 沫 单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 面 板 ， 单 击 该 面 
板 中 的 加 号 “+” 按 钮 ， 从 弹出 的 染 单 中 选择 “记录 集 (查询 )” 人 命令， 将 打开 “记录 集 ” 
对 话 框 。 

在 该 对 话 框 中 进行 如 下 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 rsMessage 作 为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 数 据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 杠 中， 选择 使 用 的 数据 库 表 对 象 为 message。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

设置 完成 后 的 “记录 和 集 ” 对 话 框 如 图 4-51 所 示 。 


Re 1 留言 板 系统 


名 称 : 
RE 
表格 :oossee 。 

列 :① 全 部 〇 选 定 的 : 


URL 参数 | | 
7 li 


4-51 定义 记录 集 rsMessage 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 。 将 rsMessage 
记录 集中 的 字段 绑 定 到 页 面 中 相应 的 位 置 上 ， 完 成 后 的 效果 如 图 4-52 所 示 。 


DW 文人) 軸 橋 で) 查看 (m 短信 G) 解 W) 格式 0) 人 金光) 基点 G) 宣 口 W) 番 動 0O | | > EE 


CRD ceanssnce asp siyle ess 
9 分 、 さ 1 | 。 突 时 代码 。 己 交 。。 实 时 议 图 。 相 可 | 多 ご 、 
CO OO: ーー で 


YY | 本 结 视 图 v | 


CE 細 細 間 
|]% あ GIIO 人 ひど ss 四 | 円 


[hi i  、TWw455 TA4KE/2 炒 背 傘 中立 92312) 


S| BI E: 烛 旭 有 BTI) 
加 且 标 加 ) 
:Tl 


图 4-52” 绑 定 记 录 和 集 


选择 菜单 栏 中 的 “文件 ”一 “你 存 ”命令 ， 将 修改 后 的 文档 保存 。 


_ Section 


プ ェ た * ヽ 
后 全 常理 功 能 设计 
留言 板 还 需要 设计 一 个 后 台 管理 功能 ， 方 便 网 站 所 有 者 对 留言 板 的 管理 和 控制 。 这 就 需 


要 制作 登录 后 台 管 理 的 页 面 Admin.asp， 还 有 选择 删除 多 余 留 言 的 页 面 DeleteMessage.asp 及 
删除 的 页 面 Deleteok.asp。 


Dreamvweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


“设计 后 台 省 理 登录 页 面 


Admin.asp 是 用 于 后 台 登 录 的 页 面 ， 页 面 比较 人 简单， 需要 用 户 名 及 密码 两 个 动态 对 象 及 
提交 表单 功能 按钮 。 

制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 Admin.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “后 台 管 
理 ” 在 文档 中 修改 布局 效果 ， 人 完成 后 的 静态 页 面 效果 如 图 4-53 所 示 。 


DW 中} 吊 本 (FE) 要 看 WM 生ん 位 } 标 剖 全 格式 ⑪) 二 休 尼 ) 由 点 民 ) 重 口 全 入 胞 00 | 


RRNA LT IE な な で 1 
TET 


aa cut ャ | 時 本間 "| 
CE S| P 
LB- | | 監 | 二 ,本 


[bay tdhvmei dh CHiwWhooki formy tpy LE 


[EPE 梧 式 人 | 自 东 ~ 
县 


而 本 元 = 了 且 注 二 赴 各 是 站 
還 1 HD 目標 @ 


号 in) | 天 


I CE 
图 4-53 制作 的 静态 页 面 效 果 
由 于 输入 用 户 名 及 密码 后 需要 与 数据 库 Admin.mdb 中 的 用 户 名 及 密码 核对 ， 
设置 “用 户 名 ”和 “密码 ”后 面 的 文本 域名 称 分 别 为 admin 和 password, 如 較 4-54 所 示 。 
| 


区 文本 域 字符 宽度 | | 关 型 〇 単行 ) 〇 多 行 ⑪  O 〇 密友) 
最 多 字符 数 | 初始 值 CJ 9 


禁 用 Q) 
口 只 读 @&) 
SHE 
文本 域 字符 宽度 由 | | 类 型 中 单行 G) 〇 多 行 ⑪ 。 〇 密码 @) ② 
最 多 字符 数 | | 初 始 値 ) | ||? 
器] 禁用 四 ) 
口 只 读 色 ) 


4-54 定 叉 文 本 域名 称 


用 户 可 以 通过 该 网 页 中 表单 的 提交 实现 登录 功能 。 选 择 沫 单 栏 中 的 “窗口 ”一 


“服务 需 行 为 ”命令 ， 打 开 “ 服 务 融 行为 ”面板 。 单 击 该 面板 中 的 加 “+” 瑟 按钮， 从 打开 的 
某 单 中 选择 “用 户 身 份 验证 ”一 “登录 用 户 ” 命 令 ， 如 网 4-55 所 示 ， 同 该 网 页 中 添加 登录 


用 户 的 服务 左 行 为 。 


| Dw 文件 (『) 编辑 (F) 查看 (Y) 插入 (I) 修 改 (W) 格式 (0) 命令 (C) 站 点 (3) 窗口 (帮助 (0H) | 


itchap04KAdmim.asp 


园 合 地址 : 


EZ © 


・ 台 管 5 
人 Mania 拆 分 | 设计 | | 实时 代码 | 乒 交 | 实时 视图 | 检查 | @) 全. 标题 : 后 台 ed nk 


| “记录 集 ( 查询 ) 
命令 


重复 区 域 
记录 集 分 页 
显示 区 域 
动态 文本 


店 点 。 


转 到 详细 页 面 
转 到 相关 页 面 


限制 对 页 的 访问 ”| XsrT 转换 
ats a 编辑 服务 器 行为 
| 新 建 服务 器 行为. 


| ”获取 更 多 服务 器 行为 .. a 


| 回 目标 吕 | 


5 
ellessag. . . 12EB ASF 立件 


4KB ASF 文件 
2KB ASF 文件 。 


出 | 3 
3 1 个 本 地 项 目 被 选中 ,总共 3007 


4-55 添加 “登录 用 户 ” 的 服务 器 行为 


打开 如 图 4-56 所 示 的 “登录 用 户 ” 对 话 框 ， 该 对 话 框 的 第 一 部 分 用 来 设置 表 


单 中 的 文本 域 的 功能 。 


具体 设置 如 下 : 


@ 从 “从 表单 获取 输入 ”下 拉 沫 单 中 选择 该 服务 闫 行为 使 用 网 页 中 的 forml 表单 对 象 中 
浏览 者 填写 的 对 象 。 
@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 Admin 对 象 ， 设 定 该 用 户 登 录 服 务 天 行 为 
的 用 户 名 数据 来 源 为 表单 的 Admin 文 本 域 中 浏览 者 输入 的 内 容 。 


的 用 户 名 数据 来 源 为 表单 的 password 文 本 域 中 浏览 者 输入 的 内 容 。 


CONNo 


Admin。 


从 6 表格 ?2? 


从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 该 用 户 登 录 服 务 器 行为 


从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 颖 行为 使 用 的 数据 源 连 接 对 象 为 


下 拉 列 表 中 选择 该 用 户 登 录 服 务 右 行为 使 用 到 的 数据 库 表 对 象 为 


从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 Admin 存 储 用 户 名 的 字段 为 Admin 字 段 。 
从 “密码 列 ” 下 拉 列 表 中 选择 表 Admin 存 储 用 户 密 人 码 的 字段 为 Password 字 上段 。 


在 “如 采 登 录 成 功 ， 转 到 ”》 


文本 框 中 输入 登录 成 功 后 ， 转 癌 DeleteMessage.asp 页 面 。 


し 】 
@ 
@ 
@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 问 Admin.asp 页 面 。 
其 


《他 参数 你 持 默 认 值 ， 设 置 后 的 “登录 用 户 ” 对 话 框 如 图 4-56 所 示 。 


G9) 议 间 


完成 后 ， 单 击 “ 确 定 ” 鬼 钮 ， 


完成 登录 页 和 面 的 制作 ， 此 时 的 “服务 右 行 


为 ”面板 如 图 4- 


57 所 示 。 


从 表单 获 职 输入 : Form1 


用 户 名 字段 : 

密码 字段 : 

使 用 连接 验证 : 

表格 : 

用 户 名 列 |: 

密码 列 : 

如 果 登 录 成 功 ， 转 到 |: 


如 果 登 录 失 败 ， 转 到 |: 
基于 以 下 项 限制 访问 : 


4-56 


admin 


password 


coon 


hdmin 


Admin 


Password 


DeleteMessage. asp 


[| 转 到 前 一 个 URL( 如 果 它 存在 ) 


C 用户 名 、 客 码 和 访问 级 别 
获取 级 别 自 : I 


“登录 用 户 ” 对 话 杠 


リク 制作 删除 留言 页 面 | 
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| 再生 


十 一 苹 档 汪 型 : hSP VWEScript 


4-57 设置 后 的 “服务 需 行 为 ”面板 


登录 成 功 后 进入 DeleteMessage.asp 负面， 此 页 面 和 前 面 制 作 的 ListMessage.asp 页 面 不 


同 的 地 方 就 是 单 击 想 要 删除 的 留言 主题 ， 将 进入 Deleteok.asp 删除 的 页 面 。 


DeleteMessage.asp 页 面 的 制作 步骤 如 下 : 


在 Dreamweaver CSS 中 双击 “文件 ”面板 中 已 经 制作 好 的 ListMessage.asp 页 
面 ， 然 后 再 选择 菜单 栏 中 的 “文件 ”一 “另存 为 ”命令 ， 打 开 “ 另 存 为 ”对 话 框 ， 在 “文件 


名 ”文本 框 中 输入 DeleteMessage.asp， 如 图 4-58 所 示 。 


保存 在 这) : 回 chap04 


| notes 

| ョ dmin 

| ココ Connections 
Dcss 

器 data 

器 images 
psd 
Admin 
indsx 


TT InsertMessage 
ListNessage 
トー 

hmoban 
ShowMessage 


立件 名 (MW): [Deletellessage. asp 
保存 美 型 J): | 1 Documents (*.htm;*. html;*. shtm;*. W 取消 


EEE 


・ 


4-S8 “另存 文件 为 DeleteMessage.asp 


第 4 童 @EL EA 


单 击 “ 人 保存” 按钮 ， 完 成 复制 页 面 的 操作 。 输 入 新 文字 “请 单 击 选择 要 删除 的 
留言 ， 进 入 删除 页 面 ?， 完 成 后 的 效 末 如 图 4-59 所 示 。 

接 下 来 修改 该 页 向 ， 单 击 留 言 的 主题 可 以 进入 Deleteok.asp 负面， 双击“ 服务 
器 行为 ”面板 中 的 “ 转 到 详细 页 面 ” 行 为 ， 如 网 4-60 所 示 。 


十 一 辫 档 类 型 : hsP VESeript 


记录 集 rsMessagel 

中 rsMessage. Eirst record) 
动 意 女 本 [rsMessaee. last racnrdd]l 
动态 站 本 rsMessage. total record) 
重复 区 域 (rsMessage) 
| 评 纳 万 抽 | 

中 rsMassaga. stnbjeet] 

动态 总 本 [rsMessaee. author) 
动容 人 本 rsMessage. time】 

如 果 十 是 第 一 条 记录 则 显示 rsMes... 
迄 至 第 一 条 记录 (YsNessage) 

如 果 记 录 集 趟 尘 空 则 显示 rsMessage) 
稼 至 前 一 和 记录 性 sNessage) 

如果 记录 集 涉 汶 宝 则 显示 rsMessage】 
乏 圣 下 一 条 记录 rsMessage】 

如 果 涉 是 最 后 一 条 记录 则 显示 fro... 
乏 动 到 最 后 一 条 记录 rsMessage】 


a 


[rps sgbjart br | i 
计划 而 关 开 训 尾 曾 间 元 新 草 而 关 此 革 着 间 间 寺 国 癌 生 宰 台 入 这 忻 间 是 未 羡 地 第 符 训 各 录 忻 刚 星 示 ， 
冰 夏 上 一 臣 下 一 覧 量 几 页 


1 
(dry (HiwWmi dh Oi wp [人 入 中 羡 92312 


图 4-59 修改 后 的 页 面 效果 图 4-60 选择 “ 转 到 详细 页 面 ” 服 务 需 行为 


打开 “ 转 到 详细 页 面 ” 对 话 框 。 在 “详细 信息 页 ”文本 框 中 输入 要 转 入 的 新 页 
面 /Deleteok.asp, 如 関 4-61 所 示 。 


链接 : 
详细 信息 页 : |/Deleteok. ssp | 


传递 URL 参 数 : 设置 为 以 下 项 的 值 
记录 集 : | snessage v 


列 : Tn v| 
传递 现 有 参数 : [ ] URL 参数 
し | 表单 参数 


图 4-61 修改 转 入 的 细节 页 地 址 


单 击 “ 确 定 ” 按 钮 ， 则 完成 DeleteMessage.asp 的 制作 。 


2 时 删除 成 功 页 面 的 制作 | 


这 个 页 面 是 真正 实现 留言 删除 的 页 面 ， 主 要 应 用 “服务 右 行 为 ”和 面板 中 的 “删除 记录 
命令 。 此 页 面 同 前 面 制 作 的 ShowMessage.asp 页 面 不 同 的 地 方 是 需要 插入 一 个 表单 和 一 个 删 
除 按钮 ， 因 为 提交 删除 命令 时 需要 把 所 有 的 数据 传 到 数据 库 中 。 

Deleteok.asp 页 面 的 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 Deleteok.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “后 从 
管理 ?”。 在 文档 中 修改 布局 效 末 ， 完 成 后 的 静态 页 面 效果 如 网 4-62 所 示 。 


一 和 


[iW 立 件 人 購 固 (m 查看 必 1 。 攻 天 三 帐 果 合格 起] 南平 工 ] 知 点 区 画 口 rt) 程 肋 呈 | 
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4-62 Deleteok.asp 页 面 设计 


第 2 版 


に TET 
ER 


选择 采 单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 和 面板 ， 单 击 该 
面板 中 的 加 “+” 扎 按钮 ， 从 弹出 的 菜单 中 选择 “记录 集 ( 碍 询 )” 命 令 ， 将 打开 “记录 


集 ” 対策 椎 。 
在 该 对 话 框 中 进行 如 下 设置 


在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 


ID 值 进行 UREL 参 数 的 传递 ， 如 图 4-63 所 示 。 


5 Eee 。。==。。 | 
Tr ll 再 コ 
© 


列 : で ) 全 部 馈 选 定 的 : 


六 下 


4-63 ”定义 记录 集 


在 “名 称 ” 文 本 框 中 输入 rsMessage 作 为 该 记录 集 的 名 称 。 
从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 数 据 源 连接 对 象 。 
从 “表格 ”下 拉 列 表 框 中 ， 选 择 使 用 的 数据 库 表 对 象 为 message。 


在 “ 科 选 ” 栏 中 设置 记录 集 过 滤 的 条 件 为 ID、=、URL 参 数 、ID， 意 思 是 由 指定 的 


留言 板 系 统 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 。 返 回 到 “ 文 
档 ”窗口 。 

将 rsMessage 记录 集中 的 字段 绑 定 到 页 面 中 相应 的 位 置 上 ， 完 成 的 效果 如 图 4-64 
所 示 。 


DW 人) 访 提 (1) 論者 (Y) 手 入 (I) 塘 汉 全 格式 t0) 命 争 红 ) 站 点 (5) 入口 (1) 共生 GD | | 


。 代 M | 扒 钞 这 i  、 友 相 代 了 に イ 、 名 上 鶴田 人 本 る 忆 、 司 本 蔓 ; 后 E 忆 可 
Oot I 全 ) 
动态 


(vwtsew saait) 


3 nl i 
ZI 4> TX ST IT [hG ho -Tx 55x 人 中 文人 


* pst 
ii ™ hhin ssy 4 
| <> mL | 格式 ぜ ) 无 ~ 英 元 v1 村 二 jletelass se MEN AST 立业 


jb ma) 元 円 還 : 1 “oo HE eto dap x8 AgT 時 
™ index ssp ers AST 次 首届 
本 - 


是 


图 4-64 ” 绑 定 记录 和 集 


单 击 “服务 堪 行 为 ”面板 中 的 加 号 “+” 按 钮 ， 从 打开 的 染 单 中 选择 “删除 记 
孙 ” 命 令 ， 添 加 删除 记录 的 服务 器 行为 。 打 开 如 网 4-65 所 示 的 “删除 记录 ”对 话 框 ， 该 对 
话 框 中 的 第 一 部 分 用 来 设置 表单 中 的 文本 域 的 功能 。 
进行 如 下 设置 : 
从 “连接 ”下 拉 列 表 中 选择 coonmessage 作 为 数据 源 连 接 对 象 。 
从 “从 表格 中 删除 ”下 拉 列 表 中 选择 message 作 为 使 用 的 数据 库 表 对 象 ， 即 存储 讨论 
主题 的 表 对 象 。 
@ 从 “选取 记录 自 ” 下 拉 列 表 中 选择 rsMessage 记 录 集 作为 要 删除 的 记录 对 人 象 。 
@ 在 “唯一 键 列 ”下 拉 列 表 中 选择 主键 字段 为 ID。 
@ 从 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 forml 。 
@ 在 “删除 后 ， 转 到 ” 栏 中 设置 记录 成 功 删 除 后 ， 切 换 到 /index.asp 网 页 。 
其 他 参数 保持 默认 值 ， 设 置 后 的 面板 如 图 4-65 所 示 。 


连接 : coomnmessage 
从 表格 中 册 除 : 
选 职 记 录 自 : rshllessage 


唯一 键 列 : マ | 四 数值 
提 变 此 表单 以 删除 : | forml wv | 
删除 后 ， 转 到 : /findex.asp | 


4-65 添加 “删除 记录 ”的 服务 右 行 为 
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单 击 “ 确 定 ” 按 钮 ， 完 成 删除 记录 行为 设置 ， 选 择 采 单位 中 的 “文件 ”一 “你 
存 ” 命 令 ， 将 文档 你 存 。 


4.5 留言 板 系 统 测 试 


留言 板 的 测试 及 优化 很 重要 ， 通 过 在 浏览 器 中 进行 测试 留言 板 的 执行 效果 可 以 合 找 出 该 
留言 板 系 统 的 不 足 之 处 ， mr 


2 于 留言 功能 测试 
测试 的 步 又 如 下 : 
首先 在 message.mdb 数据 库 中 输入 一 些 用 于 测试 的 数据 。 然 后 打开 正 浏览 


， 在 地 址 栏 中 输入 http://127.0.0.1， 打 开 index.asp 文件 , 如 較 4-66 所 示 。 在 该 页 面 中 单 击 
Pe 文本 ， 跳 转 到 InsertMessage.asp 页 面 。 


交 乍 时) 访 强 和 时! 查 看 此 | 收 矢 品 ) 工具 和 I) 和 屡 助 吧 
| 9 - 回 較 の 


塌 址 二 | | 三] tap A.D 


- ロロ 只 素 昌 话 
01-234-4567 加 


Woe 
可 py 


鼎 盘 中 心 


Ril | 
デー 玉 章 市 通州 区 右 站 入 前 


4-66 EnterMessage.htm 页 面 


在 InsertMessage.asp 页 面 中 ， 按 如 图 4-67 所 示 ， 输 入 留言 内 容 。 
输入 留言 内 容 后 ， 单 击 “ 提 交 ” 按 钮 ， 浏 览 器 将 目 动 跳 转 到 ListMessage.asp 
页 面 ， 显 示 当 前 数据 库 中 已 有 的 留言 列表 ， 如 图 4-68 所 示 。 


汉 捕 入 机 - Nicrosoft Internet Explorer 加 回国 
: 文件 到 ) ”编辑 正 ) 查看 ”收藏 自 ) 工具 て) 娠 助 ⑪ 和 


四 银 : 轩 -上 状 国 的 用 国 责 WE 因 四 -登台 : 


1 地 址 部 ) 下 http://127.0.0.1/InsertMNessage. asp 


マ | 回 5 到 


a 
主页 | 注册 | 登录 


后 台 管 理 


: 留言 测试 | 
: 洋吉 者 | 


: test@test. com 


这 是 用 来 误 试用 的 留言 | 


Copyright @ 2000-2008 北京 恋 达 美食 ALL Rights Reserved. 
联系 电话 : 010-123456 ”传真 : 010-123456 


图 4-67 填写 留言 板 


当 罗列 一 Nicrosoft Internet Explorer 
: 文件 下) 编辑 于) 查看 收藏 入 工具 JT) 帮助 册 ) 


Om © 回 回 QP mr OC SE DS 


: 地 址 J) 图 http://127.0.0.1/ListMessage. asp 


ong? 


マ 


从 
主页 | 注册 | 登录 


现在 显示 的 是 第 1- 第 3 条 记录 ， 共有 3 条 记录 


| | wmasss 
| ww | | a 
上 一 页 下 一 页 


联系 电话 : 010-123456 ”传真 : 010-123456 


| 
办 Internet 


图 4-68 显示 留言 列表 


单 击 ListMessage.asp 页 面 中 留言 主题 文字 上 提供 的 链接 对 象 ， 跳 转 到 
ShowMessage.asp 页 面 查 看 留言 的 详细 内 容 ， 如 图 4-69 所 示 它 所 链接 的 是 第 一 条 信息 ， 要 解 
决 这 个 问题 ， 需 要 对 罗列 页 单 击 选择 “主题 ”后 的 值 传 给 显示 页 面 并 显示 相关 的 内 容 。 

这 里 打开 ShowMessage.asp 由 面 进行 进一步 完善 ， 双 击 服 务 占 行为 中 建立 的 
rsMessage 记录 集 ， 在 弹出 的 对 框 中 进行 修改 ， 由 于 设置 了 ID 值 是 目 动 生 成 的 唯一 键 
值 ， 可 以 饶 选 ID、=、URL 参数 、ID 值 ， 即 由 指定 的 ID 值 进 行 URL 参数 的 传递 ， 修 改 
如 图 4-70 所 示 。 
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ernet Explorer 
文件 ) 纺 柱 (ER) 查看 (VW 改 宗 局) 工具 T) 帮 动 1) 


< 


地 志 看] betes: /1/127 O00 1/Showlessaes, ssp?ID=5 


图 4-69 出错 显示 的 信息 


= し assage 


连接 : Coormessaege v 


表格 


列 : で 全 部 〇 选 定 的 : 


TI 


图 4-70 ”修改 筛选 值 


在 ShowMessage.asp 页 面 中 ， 能 够 显示 出 发 言 人 的 E-mail 地 址 。 但 是 ， 现 在 的 
网 页 中 显示 的 还 是 纯 文 本 型 的 E-mail 地 址 ， 还 应 该 创建 E-mail 链接 ， 使 浏览 者 单 击 该 地 址 


能 够 直接 弹出 默认 的 邮件 编辑 软件 ， 给 该 留言 人 发 邮件 。 
单 击 选中 {rsMessage.email} 字 段 ， 然 后 在 对 应 的 属性 设置 面板 中 的 “连接 ” 文 


本 框 中 输入 邮件 链接 地 址 mailto: <%=(rsMessage.Fields.Item("email").Value)%>， 如 图 4-71 


所 示 。 
nt = 
2 だ : ょ = 


|mr | 本 四 
CSS In I) i lds Tten re i 

国 単元 格 求 平 默 认 ”~v| 宽 | | 不 換 行 [] 背景 
一 口 放 和 外 黑 V 選 高 | 細口 


4-71 创建 邮件 链接 


编辑 完成 后 ， 将 网 页 保存 。 可 以 进行 测试 。 单 击 该 邮件 链接 对 象 ， 应 月 动 默 认 
的 邮件 编辑 软件 ， 如 Outlook 等 ， 供 浏览 者 或 留言 人 发 信 。 


4.5.2 


接 下 来 测试 后 人 台 管 理 部 分 ， 测 试 的 步骤 如 下 : 
打开 正 浏 览 器 ， 在 地 址 栏 中 输入 http:/127.0.0.1， 打 开 index.asp 文件 ， 在 该 页 
面 中 单 击 “ 后 台 管 理 ” 文 本 ， 跳 转 到 Admin.asp 页 面 ， 如 网 4-72 所 示 。 


汉 后 台 管 理 - Nicrosoft Internet Explorer 加 回国 
: 文件 \) 编辑 到) 查看 WD 收藏 入 工具 で) 帮助 


Om OO 図 国人 ぬ ぬ の 時 補 we の 回 ・ 縛 橋 


;地址 0) | 緒 ] http://12T.0.0.1/Admin. ssp 


へ 


主页 | 注册 | 登录 | 网 站 地 图 | 收藏 本 站 


后 台 管理 关于 我 们 


留言 板 后 台 登 录 管 理 
用 户 : |adnin 
密码: |adnin| 


Copyright @ 2000-2008 北京 恋 达 美食 ALL Rights Reserved. 
联系 电话 : 010-123456 ”传真 : 010-123456 


图 4-72 打开 后 全 登录 页 面 


在 “用 户 ” 文 本 框 中 输入 admin， 在 “密码 ”文本 框 中 输入 admin， 然 后 单 击 
“人 确定” 按钮， 进入 DeleteMessage.asp， 如 图 4-73 所 示 。 


育 后 台 管理 - Nicrosoft Internet Explorer 加 回国 
: 文件 字 ) 编辑 代 ) 查看 如 ”收藏 上 工具 G) 和希 助 ⑪) 


Om OO EEO PD 丈 we 因 包 -和合 E 


; 地 址 ⑪) | http://127.0.0. 1/DeleteMessage. asp 


请 单 击 选择 要 删除 的 留言 ,进入 删除 页 面 


现在 显示 的 是 第 1- 第 3 条 记录 ， 共有 3 条 记录 


0 *m | sm | amm 
| www | … | meesss 
| ww | < | meewms 


4-73 打开 的 DeleteMessage.asp 负面 


这 里 选择 页 面 中 的 “留言 测试 ”主题 ， 打 开 相 关 留 言 的 Deleteok.asp 页 面 ， 如 


一 和 
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图 4-74 所 示 。 


当 后 台 管理 - Nicrosoft Internet Explorer 
: 文件 W) 编辑 偿 ) 査 者 V) 収 療 ぬ ) 工具 で ) 希 助 ⑪) 


mm・ の 6 回 の 時 裕 we の 回 ・ 移 暫 ・ 


; 地 址 J) 图 http://127.0.0. 1/Deleteok. asp?ID=8 


ang? 


单 击 删除 按钮 删除 该 留言 
留言 主题 : 留言 测试 

言 者 : 负 试 者 

留言 日 期 : 2008-8-22 15:18:11 
联系 信箱 : test@test. com 

内 ” 容 : 这 是 用 来 测试 的 留 


Copyright @ 2000-2008 北京 恋 达 美食 ALL Rights Reserved 
联系 电话 : 010-123456 供 真 : 10-12345B 


多 Internet 


4-74 打开 要 删除 的 Deleteok.asp 页 面 


单 击 页 面 中 的 “删除 ”按钮 ， 如 果 删 除 该 记录 ， 并 返回 留言 板 的 首页 index.asp 
页 面 ， 则 说 明 后 合 管理 系统 没有 错误 ， 测 斌 成功。 全 此 ， 整 个 留言 系统 融 设 计 开 发 完成 了 。 


] SH HHHH 


狐 闻 系统 是 动态 网 站 建设 中 经 常用 


到 的 系统 ， 尤 其 在 政府 单位 网 站 、 教 育 
单位 网 站 或 企业 网 站 中 更 是 如 此 。 新 闻 
系统 的 作用 是 在 网 上 传播 信息 ， 通 过 对 
新 闻 的 不 断 更 新 ， 让 用 户 及 时 了 解 行业 
言 息 、 企 业 状 况 。 新 闻 系 统 中 涉及 的 主 
要 操作 是 访问 者 的 新 闻 查 询 功 能 ， 和 系 
统管 理 员 对 新 闻 的 新 增 、 修 改 、 删 除 等 
功能 ， 制 作 相 对 比较 简单 。 
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搭建 新 闻 系 统 开发 平台 に 
新 闻 系 统 规划 に 

新 闻 系 统 功 能 页 面 [ 广 7 

后 台 管 理 に 


アオ Dreannweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


业 搭 建新 闻 系统 开发 平台 


本 草 实 例 是 一 个 市 狐 闻 系统 的 “ 欧 雅 丽 ” 关 容 产 品 网 站 。 从 动态 功能 来 说 ， 主 要 介绍 如 
何 建 立 一 个 功能 完整 的 新 闻 系 统 ， 主 要 包括 新 增 、 修 改 、 删 除数 据 库 的 独 闻 记录 ， 站 页 设 计 
的 效 末 如 图 5-1 所 示 。 


| = Ea = 加 = 
| 六 全 FF 坊 针 下) 本 人 刀 屋 4) 六角 縛 和 Ti 本 VI 暫 ロ OW 電 生 3 
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『 一 巨 品 莹 往 


美丽 与 自信 并 和 入 | 
新 馬 更 , 新 形 守 “| Du 


四 是 而 年 吕 


5-1 设计 的 站 页 效果 


本 实例 是 一 个 经 典 的 新 闻 系 统 网 页 。 需 要 按 一 般 的 步骤 进行 Photoshop CS5 分 割 图 片 ， 
建立 本 实例 的 站 点 chap05, 配 連 IIS 站 点 浏览 ， 使 用 div+CSS 布局 静态 页 面 儿 个 环节 。 


月 胃 使用 Photoshop CS5 分 割 图 片 


用 Photoshop CSS 切 族 工具 分 割 首 页 图 乒 ， 其 体 步 又 如 下 : 

在 本 地 D 盘 下 建立 站 点 文件 夹 Chap05， 建 立 一 些 常 用 的 文件 夹 。 启 动 
Photoshop CS5， 选 择 菜 单 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开光 盘 中 所 做 的 首页 平面 效果 
index.psd 文件 ， 如 图 5-1 所 示 。 

首先 切割 最 上 面 的 “ 欧 雅 丽 ” 标 题 ihdex.psd 年 102%% (主要 , RGBY 
行 的 图 片 ， 单 击 工具 箱 中 的 “切片 工具 ”按钮 [区 = 王 際 
为 ， 从 场景 的 左上 角 拖 电 到 标题 的 右 下 角 ， 如 
图 $-2 所 示 ， 图 中 绘制 的 虚线 框 就 是 切片 大 小 ， 
切片 后 左上 角 将 显示 国 图 图 标 。 

接 下 来 分 割 其 他 图 片 部 分 。 保 持 
“切片 工具 ”按钮 | 蜀 选 中 状态 ， 按 下 《Ctrl+ ーー 
H) 组 合 键 ， 打 开 辅 助 线 视 图 ， 可 以 先 用 辅助 线 图 5 2 Logo 部 分 的 切片 至 灯 


分 割 好 需要 分 割 的 区 域 ， 按 照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 9 个 小 图 片 ， 如 图 5-3 
所 示 。 
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新 感 克 ， 新 形 时 
站 mo 


图 5-3 ”切片 整个 首页 的 效果 


选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打开“ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 236,“ 扩 散 ” 模 式 ， 
“ 仿 色 ” 值 为 100%， 其 他 设置 如 图 5-4 所 示 。 


下 人 而 Webh 和 遇 看 师 妥 梅生 和 奋 全 了 


[I き ゐ きく 人 は 


村 太 小 
LI 放っ 再 妇 出 :tm 
| | 


回 回 | ine 責 還 ーー 一 


[Drie cu [RW | 四 中 


图 5-4 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


蛙 击 “存储 ”按钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 选择 “保存 
在 ”后 面 的 下 拉 三 角 按 钮 六 ， 选 择 建 立 的 chap05 文件 夹 ， 其 他 参数 保持 默认 值 ， 设 置 如 图 
5-5 所 示 。 


新 闻 系 统 
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将 优化 铺 果 存储 为 


保存 在 QD) し つ has 


图 5-5 “将 优化 结果 存储 为 ”对 话 框 设置 


单 击 “你 存 ” 按 钮 ， 完 成 保存 切片 的 操作 。 打 开 你 存 文件 的 路 径 ， 可 以 看 到 目 
动 生成 了 一 个 images 的 文件 来 ， 文 件 夹 里 是 再 面 分 割 后 产生 的 小 图 片 ， 由 这 些小 图 片 组 成 
了 和 页 的 效果 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 5-6 所 示 。 
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Wy 打 串 前 


宮 件 面 攻 表 作 者 
9 一 个 新 光 们 内 
婴 李 这 T 文 件 丙 发 


$-6 分割 后 的 小 图 片 


引 配置 新 闻 系统 站 点 服务 器 


接 下 来 使 用 IS 在 本 地 计算 机 上 创建 新 闻 系 统 的 站 点 ， 配 置 步骤 如 下 : 

首先 启动 IS, 在 IS 窗口 中 ， 右 键 单 击 “ 默 认 网 站 ”选择 菜单 中 的 “属性 ” 
命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 5-7 所 示 。 

单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 新 闻 站 点 文件 夹 路 
径 为 “D:chap05”， 其 他 参数 保持 默认 值 ， 议 置 如 图 $-8 所 示 。 


网 站 |IsAFI 筛选 器 | 主 目录 | 文档 “ ‖ 目录 安全 性 | HTTF 头 | 自 定义 错误 网 站 


ISAFI 往 选 器 | 主 目录 
网 站 标识 


连接 到 资源 时 的 内 容 来 源 : 


描述 (8): ER Pl | ©⑤ 此 计算 机 上 的 目录 ①) 


ー ム 共享 
"MO 。 | 全 3 om mw 
TCF 端 口 ①): ssL 端 口 

本 地 路 径 (C): D: AehapD8 
连接 


中 脚本 资源 访问 闻 ) 记录 访问 0 
连接 超时 (8) : b 4 (ER) 索引 資源 ) 
写 入 他) 
保持 HTTF 连接 台 ) 口 目录 训 览 @) 
启用 日 志 记 录 ) 应 用 程序 设置 


活动 日 志 格 式 ⑰: 应 用 程序 名 W) : 默认 应 用 程序 | [删除 外) | 
W3C 扩展 日 志文 件 格式 | | 尾 性 Eg). 开始 位 置 : 人 默认 网 站 》 


| 配置 .| 
执行 权限 ): 征服 まま 本 
应 用 程序 保护 (WD): 中 典 用 vv 生 坊 碟 ) 


5-7 “默认 网 站 属性 ”对 话 框 5-8 ”设置 网 站 的 “本 地 路 径 ” 


单 击 “确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 配置 ， 由 于 前 和 耐 已 经 使 用 
Photoshop CS5 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 TE 浏览 器 输入 地 
址 http://127.0.0.1， 即 可 打开 页 和 面 分 割 后 的 效果 ， 如 图 5-9 所 示 。 


3 mdes 一 Nerrsntt lnternet Esplerer 
痪 件 三 1 環 還 民 | 奄 置 WW| 大 本 品 h 工員 Hf 輔 遇 中 
GO の 回 回 @ Pe hm OED Ee- 


el | ntp 0 Fidee. biel 


美丽 与 自信 和 并存 入 
新 感 完 ， 新 形象 


| 環 面 皿 正 


Ca pT FT 二 Da 
だ 2 Enlmlz2M55 


图 5-9 浏览 的 最 初 效 果 


当 可 以 浏览 到 Photoshop CSS 分 割 后 的 网 页 效果 时 ， 说 明 站 点 服务 占 的 配置 已 经 完成 ， 
束 可 以 开始 下 一 步 制 作 了 。 


使用 Dreamweaver CS5 进行 网 页 布局 设计 时 ， 首 先 需 要 使 用 定义 站 点 问 导 定义 站 点 ， 操 


作 步 骤 如 下 : 
打开 Dreamweaver CS5， 选 择 菜 单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 


PAAA) 
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“管理 站 点 ”对 话 框 。 

单 击 右边 的 “新 建 ” 按 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ”对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ” chap05。 

“本 地 站 点 文件 夹 ” D:hap0S\。 

如 图 5-10 所 示 。 


站 点 设置 对 锣 chap05 


一 | Dreamweaver : 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweayver 
站 点 通常 包含 两 个 部 分 : 可 在 其 中 存 情 和 处 理 文 件 的 计算 机 上 的 本 地 文件 
版 本 控制 夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 到 Web 上 的 服务 器 上 的 远程 文件 去。 


”高 级 设置 


您 可 以 在 此 处 汶 Dreamweaver 站 点 选择 本 地 立 件 夹 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 夹 : = 


图 5-10 ”设置 站 点 对 话 框 


单 击 “ 分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 
“服务 器 名 称 ” chap05。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ” Di\chap05\。 

“ Web URL”: http://127.0.0.1。 

配置 后 的 “测试 服务 器 ”的 参数 设置 如 图 5-11 所 示 。 


站 点 设置 对 旬 chap05 


服务 器 名 称 : 
ほか 
有人:[Achsp05 ”| 名 


图 5-11 “服务 占 ” 选 项 卡 的 参数 设 管 


所 ;新 闻 系 统 


单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 这 样 ， 在 Dreamweaver CS5 中 就 已 
经 拥有 了 刚才 所 设置 的 站 点 了 。 


使 用 div+CSS 布 局 网 页 ) ②③) 


整体 的 页 面 布局 规划 设计 ， 如 图 5-12 所 示 。 


1 
11 I 
I ogo i #tupian1 
| 1 | 
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| ] 
| 1 1 | 
1 1 1 1 
1 1 1 | 
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| es I I M 

#lianjie | 1 #xinwen 
I 

1 1 1 

1 1 1 

1 1 1 

1 1 1 

1 1 1 

1 1 1 

1 1 1 

1 1 1 


#tuplan2 
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1 | 
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图 5-12 整体 布局 框架 设计 


使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 XHTML 1.0 文档 
格式 ， 将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


<IDOCTYPE html PUBLIC "-/W3C/DID XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 


<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 


<link rel="stylesheet" href="css/style.css" type="text/css" /> 
<title> 新 闻 系 统 </title> 
</head> 


其 他 div 的 布局 代码 如 下 : 
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<body> 
<div 1d="top"> 
<div 1d="logo"></div> 
<div id="tupian1 "></div> 
</div> 
<div id="mid"> 
<div id="daohang"> 
<div class="wenzi"><a hre 仁 "#"> 网 站 首页 </a></div> 
<div class="wenzi"><a hre 仁 "#"> 产 品 资讯 </a></div> 
<div class="wenzi"><a hre 伍 "#"> 美 丽 护 理 </a></div> 
<div class="wenzi"><a hre 仁 "#"> 新 闻 中 心 </a></div> 
<div class="wenzi"><a hre 仁 "#"> 联 系 我 们 </a></div> 
</div> 
<div 1d="banner"></div> 
<div 1d="tuplan2"></div> 
<div 1d="lianjie"></div> 
<div 1d="biaoti"><img src="/images/index 07.jpg" /></div> 
<div id="word"> 
<div class="neirong"> 
<p><a href="#'"> 公 司 高 层 深入 市 场 一 线 考察 ..。 ”2008-06-02</a></p> 


<p><a hre 伍 "#"> 欧 雅 丽 5 周年 庆 系 列 活动 … 2008-05-25</a></p> 
<p><a hre 伍 "#"> 欧 雅 丽 参 加 上 海 美博 会 ..… 2008-05-23</a></p> 
<p><a hre 伍 "#"> 欧 雅 丽 参加 北京 美博 会 .… 2008-04-23</a></p> 
<p><a hre 伟 "#"> 欧 雅 丽 参加 广州 美博 会 … 2008-03-23</a></p> 

</div> 

</div> 

</div> 


<div id="bottom"> 
<div id="bot"></div> 
</div> 

</body> 

</html> 


在 站 点 中 建立 css 文件 来， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


* 整 体内 面 CSS*/ 
*{ margin:Opx; 


padding:Opx: 
} 
/# 控 制 整体 六 
body{ width: 100%; 
height: 100%; 
font:12px "宋体 ", Helvetica, sans-serif 
background:#FFF: 
} 
な 设置 所 有 图 片 的 边框 为 0*/ 


ECE: 汪 玉 新 闻 系 统 


Img { 
border:0; 
} 
/* 设置 最 外 层 居中 显示 ， 实 现 让 整个 页 面 居中 显示 z 
#top,#mid,#bottom { > 
margin: auto; 
width:840px; 
} 
な 设置 左 浮 动 的 标签 */ 
#logo,#tupian 1,#daohang,#banner,#tupian2,#lianjie,#b1iaoti,#word,#bot{ 
float:left: 
} 
p{ line-height:1.9; 
} 
な 页 面 链 接 */ 
a:link { 
color: #SF9406: 
text-decoration: none: 


} 


a:visited { 


text-decoration: none: 
color:#62b400: 
) 
a:hover { 
text-decoration: underhne: 
color#FFB11S: 
) 
a:actiVe { 
text-decoration: none; 
color:#ffe30b: 
} 
/*top 部 分 */ 
#logo{ 
width:154px: 
height:96px: 
background-image:url(/1mages/index Ol.gif); 
) 
#tuplan1 1 
width:686px: 
height:96px: 
background-image:url(/1mages/index 02.jpg): 
} 
/*mid 部 分 */ 
#daohang{ 
width:154px; 
height:173px: 
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background-image:url(/mages/index 03.jpg): 
} 

#banner{ 

width:686px; 

height:173px; 

} 

が tuplan21 

width:154px: 

height:308px: 
backeround-image:url(/images7index 05.jpg): 
} 

#lianjie{ 

width:327px; 

height:308px; 

} 

#biaoti{ 

width:359px; 

height:38px:! 

#word1 

width:359px; 

height:270px; 
background-image:url(/1mages/index 08.jpg); 
} 

#newsword!{ 

margin-top: 15px; 

margin-left: 180px; 

marein-right:40px: 

} 


/*bottom 部 分 */ 
#bot{ 
width:840px; 
height:70px: 
background-image:url(/1mages/index 09.gif); 
} 

.WenZ11 
margin-top: 15px; 
margin-left:40px; 
margin-right:40px; 
font-size: 1 6px; 
color:#62b400: 

) 

.nelTOng1 
margin-top: 13px; 
margin-left: 1 Spx; 

} 


制作 完成 后 即 可 以 在 下 浏览 器 中 显示 布局 后 的 效果 。 
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新 闻 系 统 


新 闻 系 统 规划 


新 闻 系 统 包括 前 台新 闻 显 示 和 后 台新 闻 管 理 两 部 分 内 容 。 数 据 库 的 设计 首先 要 设计 一 个 
存储 管理 者 账 志 和 密 但 的 数据 表 user， 还 要 设计 一 个 存储 新 闻 标 题 内 容 的 数据 表 news， 在 后 


面 实例 制作 的 过 程 中 能 够 实现 新 闻 资 料 的 储存 、 修 改 、 删 除 和 诬 加 功能 。 


| 系统 规划 设计 


本 系统 主要 分 成 用 户 浏 览 页 面 与 管理 者 登录 页 面 两 个 部 分 ， 其 中 index.asp 是 这 个 网 站 
的 首页 。 访 狐 闻 系统 主要 由 以 下 动态 网 页 构成 。 
@ index.asp: 网 站 狐 闻 的 首页 。 
news.asp: 显示 所 有 新 闻 标 题 的 页 面 。 
newscontent.asp: 显示 详细 狐 闻 内 容 的 页 面 。 
admin login.asp: 登录 后 人 台 管 理 页 面 。 
admin.asp: 新 闻 主 管理 页 面 。 
news add.asp: 增加 新 闻 的 页 面 。 
news upd.asp: 新 闻 更 新 页 面 。 
news del.asp: 删除 新 闻 页 面 。 


3 效 据 库 设 计 
本 实例 需要 建立 一 个 存储 新 闻 标 题 (title )、 新 闻 内 容 (content) 和 试 加 新 闻 时 间 


(fme) 等 字段 的 Access 数据 库 。 在 数据 库 中 必须 包含 一 个 容纳 上 述 信息 的 表 ， 这 个 表 为 新 
闻 信 息 表 ， 命 名 为 news。 创 建 的 新 闻 信 息 表 news 如 图 5-13 所 示 。 


数据 类 型 
自动 编号 
文本 


各 注 
日 期 7/ 时间 


数据 类 型 决定 用 户 所 能 保存 在 该 字段 中 值 的 种 
类 。 接 Fl 键 可 得 看 有 关 数 据 类 型 的 帮助 。 


$-13 ”创建 news 新 闻 信 息 表 
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数据 库 设 计 的 步骤 如 下 : 


规划 设计 新 闻 信 息 表 news 的 字段 结构 采用 表 5-1 的 结构 ， 


采用 表 5-2 所 示 的 结构 。 


- コ テー ANY 
意 文 


主题 编写 


留言 内 容 


留言 时 间 


に 


主题 编号 
用 户 账号 
用 户 密码 


字段 名 称 


首先 运行 Microsoft Access 2007 程序 。 


管理 者 信息 表 user 


自动 编号 长 整 型 


ms | し 上 
es | we | | * | 
mw  mWwml lw ー 


fi =Now() 


表 5-2 管理 者 信息 表 user 
数据 类 型 许 空 字 默 认 值 


Leams | sew | | 


打开 的 程序 界面 如 图 $-14 所 示 。 


bd | 


Ca a 
7 


cresett UiLce Uiul ine 


开 努 /和 范 馈 ルン oso な Office Access 


= ”打开 最 近 的 数 男 谋 
至 百 票 防 序 本 

le wm 新 建 室 身 数 需 库 こ プ 更 此 

Qa ee - ーー Ey DVFlarhtadhishep 


Eo) D:\sbap\adb\shop 


运行 “Microsoft Access 2007” 软 件 


图 5-14 


单 击 “ 空 白 数 据 库 ” 按 钮 .%:， 在 主 界面 的 右 侧 打开 “空白 数据 库 ” 面 板 ， 如 


$-13 所 示 。 


再 単 市 “空白 数据 库 ” 面 板 中 的 “浏览 到 某 个 位 置 来 存放 数据 库 ” 按钮 区 ， 
打开 “文件 新 建 数 据 库 ” 对 话 框 ， 在 “保存 位 置 ” 后面 的 下 拉 列 表 中 选择 前 面 创建 站 点 


chap05 中 的 mdb 文件 来 ， 在 “文件 名 ”文本 框 中 输入 文件 名 news， 在 “保存 类 型 ”下 拉 列 


表 框 中 选择 “Microsoft Office Access 2002-2003 数据 库 ”， 
GH) 单 击 “ 确 定 ” 按 钮 ， 返 回 “ 空 


如 图 5-16 所 示 。 
站 数据 库 ” 面 板 ， 如 图 5-17 所 示 。 


新 闻 系统 
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5-15 打开 “ 衬 白 数据 库 ” 面 板 


文件 新 建 数据 库 
保存 位置 て) : 回 "也 癌 力 : 团 |Xx 功 国 : 


文件 名 fe): news wv 
ET 


$-16 设置 “文件 狐 建 数据 库 ” 对 话 框 
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5-17 设置 文件 后 的 “ 空 日 数据 库 ” 面 板 


单 击 “空白 数据 库 ” 面 板 的 “创建 按钮 ” 即 在 Microsoft Access 2007 中 创建 


了 news.mdb 文件 ， 同 时 Microsoft Access 2007 自动 默认 生成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 如 
图 5-18 所 示 。 


= FE TE EE a | 
"EE 短 還 


图 5-18 ”创建 的 默认 数据 表 
用 鼠标 右键 单 击 选择 “ 表 1: 表 ” 数 据 表 ， 打 开 快 捷 菜 单 如 图 5-19 所 示 。 


ey [= rE 寺 に 一 工員 iatahuw1 : 現 環 本 IAccess 2002 - 3 立 畔 格式 - 上 y 


ここ 


图 $-19 打开 的 快捷 菜单 命 


> 


选择 快捷 末 早 中 的 “设计 视图 ”命令 ， 打开 “ 男 存 为 ”对 话 框 ， 在 “ 表 名 称 ” 
文本 框 中 输入 数据 表 名 称 news， 如 图 5-20 所 示 。 


图 5-20 设置 “ 表 名 称 ” 


新 闻 系 统 


单 击 “确定 ”按钮 ， 即 在 “所 有 表 ” 列 表 框 中 建立 了 news 数据 表 ， 如 图 5-21 
所 示 。 


表 工 具 Database1 : 数据 库 (Access 2002 - 2003 文件 格式 ) - M.… 
| 设计 | 


i — 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 链 可 章 看 有 关 字段 名 称 的 帮助 。 


设计 视图 。 F6 = 切换 窗 格 。 F1 = 帮助 。 


二 
$-21 建立 的 news 数据 表 


接 下 来 抜 表 5-1 所 示 输 入 字段 名 并 设置 其 属性 ， 


テーラ テー ビ 
区 資 其 完成 后 如 图 $-22 所 示 。 
4 字段 名 称 | 数据 类 型 
?ID 人 自动 编号 
title 文 本 
content 
time 


说 明 人 
备注 
日 期 /时 间 


字段 层 性 


自动 输入 到 该 字段 中 、 作 为 新 记录 的 值 


图 $-22 ”创建 表 的 字段 
双击 轩 news: 表 ， 打 开 news 的 数据 表 ， 如 图 5-23 所 示 。 


为 了 方便 预 帘 ， 可 以 在 数据 库 中 预先 编 辑 一 些 记 录 对 象 ， 如 图 5-24 所 示 。 


用 上 述 的 方法 ， 建 立 一 个 名 为 user 的 数据 表 。 输 入 子 段 名 并 设置 其 属性 ， 如 


图 5-25 所 示 。 


编辑 完成 后 单 击 “保存 ”按钮 加 ， 完 成 数据 库 的 创建 ， 最 后 关闭 Access 2007 软件 。 数 
据 库 和 储存 用 户 名 和 密 


记录 :44 第 1 项 ( 共 1 项 | -| 系 无 篇 选 器 -| | 搜索 
| 


数字 | 辆 呈 色色 瞩 ; 


$-23 倒 建 的 user 数据 表 


ID ご ia -| content -| time | 版 
中 睫毛 襄 性 价 大 比拼 日 常 生活 # ま すま ####### 
2 最短 時 同 靖 表 肌 肘 下 雅 夏 日 里 尽 ### 人 人 ### を 
3 详解 时 下 最 流行 美体 概念 体形 护理 ########## 
4 沙发 瑜 如 8 式 瘦身 效果 佳 谁 说 减 /于 着 兴 拓 林 闪失 基 枯 拓 六 枯 
5 舒展 身体 打造 运动 美人 适合 减肥 ########### 
6 健美 操 减 肥 的 益处 可 以 增强 关 尖 拓 林 天 枯 基准 拓 关 枯 
7 跳舞 减肥 最 新 方法 跳 押 是 一 9 せま ####### 
8 按 体 型 选择 最 佳 减 肥 运 动 保持 形体 ########## 
9 壁球 与 墙壁 搏击 的 运动 健常 能 在 # す ######### 

10 跑步 记 住 “ 慢 ” 和 “上 暗 ” 有一 時 人 ########### 


11 促使 疹 背 挺 直 的 简单 体操 
14 随 “ 心 ”所 欲 去 健身 
(新建) 


年 轻 人 加 ### 人 人 ### 共 # 
怖 洋洋 地 まま 
すす す すす すす すす す : 


$-24 news 表 中 的 输入 记录 


news : 数据 库 (Access 2002 - 2003 .… 


总 | USETIaE 7 


(新建 


浆 | 的 | 前 招租 
FSS に は 
NW 葡 简 莹 转 次 


aa | | 


password |. 
由 admin admin 


) 


( 筐 1 項 共 1 項 し り !| 逐 


数字 中 国 四 中 多 | 


5-25 user 数据 表 


:人权 等 资料 的 数据 表 建 立 完毕 。 


新 间 系 统 


于 于 数据 库 连 接 


数据 库 编辑 完成 后 ， 必 须 在 Dreamweaver CS 中 建立 能 够 使 用 的 数据 源 连 接 对 象 。 这 样 才 > 
能 在 动态 网 页 中 使 用 这 个 数据 库 文 件 。 操 作 过 程 中 要 特别 注意 ODBC 连接 参数 的 设置 。 
基体 连接 步骤 如 下 : 
在 “控制 面板 ” 中， 选择“ 管理 工具 ”打开 管理 工具 窗口 ， 双 击 运行 “数据 源 
(ODBC)” 的 快捷 方式 咒 …”， 将 打开 如 图 5-26 所 示 的 “ODBC 数据 源 管理 器 ”对 话 框 。 
单 击 “ODBC 数据 源 宫 理 占 ” 对 话 框 中 的 “系统 DSN” 选 项 卡 ， 如 图 5-27 
所 示 。 


を 10DBC 数据 和 源 管 理 壳 を 10ODBC 吏 据 源 管理 腕 
用 户 DSH | 系统 DSN | 文件 DSN | 驱动 程序 | 跟踪 | 连接 池 | 关 于 | 用 户 DSH 系统 DSH | 立件 DSH | 驱动 程序 | 跟踪 “| 连接 池 | 关于 | 
用 户 数据 源 ⑪) : 系统 数据 源 G) : 


添加 Q⑪).… | 驱动 程序 添加 四 ).. "| 


FEAT Driver do Microsoft Access [*.mdb) 


Microsoft Access dBASE Driver (*.d 


Excel Fil Mi ft Excel Dri -Xl 6 | - 
XCe iles 1crosott Exce river (kx S， 1 册 险 (E) 册 | 除 (E) 
配置 C).. 


NS Access Database Microsoft Access Driver (*.mdb, 


图 5-26 ODBC 数 据 源 管理 器 中 的 用 上 DSN 图 5-27 ODBC 数 据 源 管理 器 中 的 系 筑 DSN 


在 “系统 DSN” 对 话 框 中 单 击 “ 添 加 (D)” 按 钮 ， 打 开 “ 创 建 靳 数据 源 ” 对 


话 框 ， 如 图 5-28 所 示 。 
在 “创建 数据 源 ” 对 话 框 中 ， 选 择 “Driver do Microsoft Access (*.mdb)” 选 
项 ， 然 后 单 击 “ 完 成 ”按钮 。 打 开 “ODBC Microsoft Access 安装 ”对 话 杠 ， 在 “数据 源 名 


(N)” 文 本 框 中 输入 news， 如 图 5-29 所 示 。 


ODBC Nicrosoft Access 安装 
选择 您 想 为 其 安装 数据 源 的 驱动 程序 (8)。 数 据 源 名 W): [new| 
说 明 血 ): | 
da Microsoft exto [x*. 职 消 
r d oft dE *. dbE) ーー 
er do soft Excel (*.xl1s) 6 
o ee Faradox 9 tr. db ) 数据 库 : ue 
a 0 6 Heroso is oxPro 选择 G). . . | 创建 C)... | 修 腥 (R)... | 压缩 商 )... | ーー 
Et et tl いむ 高 级 由 .| 


系统 数据 库 


人 元 ) 
"数 据 座 て): 


322: まり 选项 (0) >> | 


图 5-28 ”创建 数据 源 图 5-29 ODBC Microsoft Access 设置 


单 击 “ 选 择 (S)” 按 钮 打开“ 选择 数据 库 ” 对 话 框 ， 如 图 5-30 所 示 。 単 二 
“驱动 器 (V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 二， 从 下 拉 菜 单 中 找到 在 创建 数据 库 步 骤 中 数据 库 
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所 在 的 盘 符 ， 在 “目录 (D) :” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 
左上 方 “数 据 麻 名 〈A)” 选 项 组 中 的 数据 库 文 件 newsumdb, 員数 据 麻 名 称 目 効 添加 色 “数 
据 库 名 (A)” 下 的 文 本 権 中 。 

技 到 数据 库 后 ， 在 “选择 数据 库 ” 对 话 框 中 单 击 “ 确 定 ” 按 钮 ， 回 到 “ODBC 
Microsoft Access 安装 ”对 话 框 中 ， 再 次 单 击 “确定 ”按钮 ， 将 返回 到 “ODBC 数据 源 管 理 
器 ”中 的 “系统 DSN” 对 话 框 中 ， 则 可 以 看 到 “系统 数据 源 ” 中 已 经 添加 了 一 个 名 称 为 
news， 驱动 程序 为 “Driver do Microsoft Access (*.mdb)” 的 系统 数据 源 ， 如 图 5-31 所 示 。 

eoDpc 数据 源 管理 器 


用 户 nsm 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系统 数据 源 S): 


目录 ⑪) : 
[news. mdb d: chapD5'mdb 


nnEC 系统 数据 可 与 指 连接 的 信息 。 系 
统 数据 源 对 当月 可 见 ， 服务 


文件 美 型 て ): 驱动 器 (\) : 


图 5-30 ”选择 数据 库 图 5-31 ODBC 数 据 源 管理 器 


再 次 单 击 “ 确 定 ” 投 钮 ， 完 成 “ODBC 数据 源 管 理 右 ” 中 “系统 DSN” 的 设置 。 

局 动 Dreamweaver CS5， 打 开 建 并 的 Chap05 站 点 ， 并 打开 index.html 页 面 ， 
将 文件 另存 为 index.asp 由 面 ， 在 Dreamweaver CSS 软件 中 执行 灯 蛙 栏 中 的 “窗口 ”一 “ 数 
据 库 ”命令 ， 打 开 “ 数 据 库 ”面板 。 

单 击 “ 数 据 库 ”面板 中 的 加 号 “+” 按 钮 ， 打 开 下 拉 菜 单 ， 单 击 选 择 “ 数 据 源 
名 称 (DSN)? 命 金 。 

打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 :” 文 本 框 中 输入 
news， 单 击 “ 数 据 源 名 称 (DSN): ”文本 框 右 侧 的 下 拉 三 角 按钮 *， 从 打开 的 下 拉 菜 单 
中 选择 在 “数据 源 (ODBC)” 一 “系统 DSN” 中 所 添加 的 news， 其 他 保持 默认 值 ， 如 
$-32 所 示 。 


数据 源 名 称 (D5NH) 


连接 名 称 : ne*| 
数据 源 名 称 (DSH): | news 


用 户 名 : 


密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSW 
② 使 用 本 地 DSH 


图 5-32 数 据 源 名 称 (DSN) 


在 “数据 源 名 称 (DSN)” 页 面 中 ， 单 击 “ 测 试 ”按钮 ， 如 打开 图 5-33 所 示 页 
面 ， 则 说 明 数 据 库 连接 成 功 ， 奋 则 应 逐一 检验 之 前 各 项 步 又 是 否 正确 完成 ， 修 改 全 测试 成 功 


统 


后 ， 单 击 “ 确 定 ” 投 钮 则 完成 此 步骤 。 
同时 在 网 站 根 目 录 下 将 自动 创建 一 个 名 为 Connections 的 文件 来 , Connections 
文件 夹 内 有 一 个 名 为 news.asp 的 文件 , news.asp 文件 可 以 用 记事 本 打开 ， 如 图 5-34 所 示 。 


回 回 図 


编辑 区 ) 格式 Q) 查看 QW) 帮助 0) 


' FileName="'Connection odbc_conn_dsn.htm" 
' Type="ADO" 

' DesigntimeType="'ADO" 

' HTTP="'false" 

' Catalog=""" 

”Schema=”” 

Dim HH news_ STRING 

Hl news _ STRING = "dsn=news;" 

る > 


图 5-33 ”成 功 创建 连接 脚本 图 5-34 成功 创建 连接 脚本 
至 此 ， 完 成 数据 库 的 连接 操作 。 


| Section | 


网 站 在 首页 中 有 一 个 显示 狐 闻 的 模 其 ， 访 问 者 可 以 单 击 “更 多 ”和 “more” 文 字 链 接 进 
入 显示 新 闻 标 题 的 页 面 进行 浏览 。 单 击 想 要 浏览 的 新 闻 标 题 即 可 进入 该 新 闻 的 详细 内 容 页 面 。 


引 新 闻 首页 的 设计 


狐 闻 发 布 后 ， 应 该 让 网 站 访问 者 在 站 外 中 看 到 最 新 发 布 的 新 闻 ， 本 市 将 主要 介绍 如 何在 


首页 index.asp 页 面 中 制作 新 闻 系 统 的 标题 显示 功能 。 
制作 步骤 如 下 : 
将 打开 的 index.asp 制作 成 静态 的 页 面 效 末 如 网 5-35 所 示 。 


Wi 文 ## 钨 提 (1) 查看 (7) 手 入 (I) 机 站 全 拉 式 0) 合 を C) 站 点 (5} 便 口 W) 共生 GD | 人 cil ” [SI 万 再 


me RS 
I 


。 代 | 撕 外 | Sit | | 天 時 花村 厂 全 了 视 用 检查 人) に ら 、 に 
"Tn 


美丽 与 自信 并 存 入 
新 感 金 ， 新 形 时 


站 


も な ここ に こさ っ ば さこ さっ で さこ ご ご ここ っ は さぶ ご ささ っ づ ざ こら で さ ご ご ざこ ど こさ づ ささ 計 さ ここ ここ っ っ こっ っ こっ っ co 


[mi tn, マ に EE 人 EEER'E EL 
Bp Gs Ma) nit 3 マウ の HR 
は EE 


1 合计 才 项 目 神 选 中 , 呈 村 3503 [BE 入 _」 


5-35 ”设计 的 静态 网 页 效果 
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接 下 来 利用 “ 绑 定 ”功能 ， 将 网 页 所 需要 的 数据 学 段 连 接 至 网 页 。 蛙 击 “ 绑 
定 ” 和 面板 ， 并 在 面板 中 单 击 “ 增 加 绑 定 ”按钮 “+”， 在 弹出 的 亲 蛙 中 选择 “记录 集 (但 
询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 rs news 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 沫 单 中 选择 news 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 沫 单 中 ， 选 择 使 用 的 数 

据 库 表 对 象 为 news。 

@ 在 “ 列 ” 栏 中 选择 “全 部 ” 单 选 近 钮 。 

@ 设置 “ 饶 选 ”的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 这 单 中 选择 了 选项 ， 然 

后 选择 “降序 ”的 排列 顺序 。 

单 击 “ 确 定 ” 投 钮 即 完成 设 定 ， 如 图 $-36 
所 示 。 

绑 定 记录 集 后 ， 将 记录 集 的 
frs news.itle! 字 段 捕 入 全 index.asp 网 页 的 适当 
位 置 ， 如 图 5-37 所 示 。 


DMW 文件 (7】 貫 括 (gm) 查 着 17) 手 入 (I) 容 層 (mW) 榨 式 们 ) 合 を C) 站 点 人 5 请 口 (1) 北 動 OO x™ 


[7 
四 


美丽 与 自信 并存 外 
新司 見 , 新 形 明 


《HL 格式 ぜ ) 芭 下 
RE a) 无 marscahtent asp? OF Ser W DD に nl 


ERE... ] 


图 5-37 插入 {rs news.ttle! 全 index.asp 网 页 中 
在 数据 库 中 加 入 相应 的 数据 后 ， 上 面具 能 显示 第 一 条 最 新 新 闻 记 录 ， 如 采 需 要 
显示 5 条 最 新 记录 ， 那 么 殴 必 须 设置 “重复 区 域 ” 功 能 。 单 击 选中 index.asp 页 面 中 需要 重 
复 的 行 ， 如 图 $-38 所 示 。 


图 5-38 选择 需要 重复 的 行 


并 >E 愉 新 闻 系 统 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 接 
着 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 。 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 
数据 “记录 ”为 5， 如 图 5-39 所 示 。 
单 击 “ 确 定 ”按钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选取 要 重复 的 区 域 左上 角 出 现 (>) 


了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 图 5-40 所 示 。 站 


遷 


trs news. title} 


图 $-39 ”选择 一 次 可 以 显示 的 记录 数 图 5-40 ” 设 定 重复 功能 后 的 效 琳 


index.asp 页 面 除 了 显示 新 闻 标 题 外 ， 还 要 提供 浏览 者 单 击 标题 链接 至 详细 内 容 
页 面 阅 读 新 闻 内 容 的 功能 ， 首 先 选 取 编 辑 页 面 中 的 新 闻 标 题字 段 {rs_news.title} 。 

单 击 “ 应 用 程序 ”面板 中 的 “服务 喜 行 为 ”标签 中 的 “+” 号 按钮 ， 在 弹出 的 
末 单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 打 开 “ 转 到 详细 页 面 ” 对 话 框 如 图 5-41 所 示 。 设 
置 “ 详 细 信 息 页 ”的 链接 路 径 为 mnewsmnewscontentasp， 其 他 设 定 值 篆 不 改变 其 默认 值 。 


详细 信息 页 : news/newscontent. asp | 
传递 URL 参数 : Tn 设置 为 以 下 项 的 值 


bd 


列 : II ママ 
传递 现 有 参数 : | ] URL 参数 
[表单 参数 


图 5-41 “ 转 到 详细 页 面 ” 对 话 框 
单 击 “ 人 确定 ”按钮 回 到 编辑 页 面 ， 单 击 女 标 选 择 帝 “more” 的 图 片 ， 在 其 对 应 
的 “属性 ”面板 中 的 “链接 ”文本 框 中 输入 : /news/mews.asp， 将 其 设置 为 指 问 news 文件 夹 
中 news.asp 页 面 链接 ， 如 图 5-42 所 示 。 
ti 


図像 , 4K 宽 门 源 女 件 G) fimages/index_OT. JPE 6 円) 替换 并 ) | マ 类 号 ) 无 
| | 高 | | 本 接 OER oc 从 和 固 ゆ 
地図 ⑩ | 委 直 边 距 [| 。 目标 @)| v| ”边框 @) [过 茹 和 4 
人 | ロロ OM 水 平 边 距 EE)| | 原始 | | ey PS 于 齐 &&) | 默认 值 v 


图 5-42 ”设置 “more...” 文 字 链 接 


现在 主页 面 index.asp 的 设计 与 制作 都 已 经 完成 ， 按 (F12〉 键 可 打开 TE 浏览 


虱 预 喉 目 前 制作 的 结果 ， 如 图 $-43 所 示 。 


下 可 闻 夭 旱 Hiersmartt Imnkermet Eaplorer 
责任 量 )】 福 模 蜡 ! 亚 而 人 这 国友 工員 Ti 本 有 册 二 


Gm 国 国 六 放量 宙 A 嫩 届 - 党 忆 
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图 5-43 ”主页 面 的 设计 结 


接 下 来 我 们 将 设计 新 闻 系 统 的 主页 面 news.asp， 这 个 页 面 将 显示 新 闻 系 统 中 所 有 的 新 闻 
标题 ， 浏 览 者 可 以 通过 单 击 要 阅读 的 新 闻 标 题 链接 到 每 一 


面 的 版 面 设计 效 末 如 图 5-44 所 示 。 
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详细 制作 步骤 如 下 : 
局 动 Dreamweaver CSS$， 人 制作 该 页 面 的 静态 效果 如 图 5-45 所 示 。 
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单 击 “ 绑 定 ”面板 中 的 “+” 号 按钮 ， 在 弹出 的 荣 单 中 ， 选 择 “ 记 录 集 〈 得 
询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 设 
定 ， 如 图 5-46 所 示 。 
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$-46 绑 定 Ts xnews 记录 集 


@ 在 “名 称 ” 文 本 框 中 输入 rs_xnews 作为 该 记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 连 接 对 象 。 
@ 从 “和 表格” 下拉 列表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 
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@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 投 钮 。 

@ 设置 “人 沛 选 ” 有 的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 列 表 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 

绑 定 记录 集 后 ， 将 记录 集中 的 frs xnews.title! 和 {rs xnews.tme} 字 段 插 入 至 
news.asp 网 页 的 适当 位 置 ， 如 图 5-47 所 示 。 


中 新闻 中 上 | 


{rs mews.t1t]ai {rs xnews. time} 


目前 没有 性 何 新 闻 


图 5-47 插入 学 段 全 news.asp 网 页 中 


在 数据 库 中 加 入 相应 数据 后 ， 网 页 上 只 显示 第 一 条 最 新 新 闻 记 录 ， 因 此 ， 需 要 
加 入 “服务 占 行 为 ”中 的 “重复 区 域 ” 的 功能 ， 单 击 选 中 news.asp 页 面 中 需要 重复 的 
行 ， 如 图 $-48 所 示 。 


{rs xnews. timel 


{rs xnews. title} 


图 5-48 ” 单 击 选中 需要 重复 的 单元 格 


然后 再 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 中 的 “+” 号 按 
包 ， 在 弹出 的 菜单 中 选择 “重复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 如 图 5-49 
所 示 。 
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图 5-49 ”选择 一 次 可 以 显示 的 记录 数 为 10 


单 击 “确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 左 上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 图 5-50 所 示 。 


新 闻 中 四 | 


图 5-50 ”完成 重复 设置 的 效果 


第 5 总 CG: 和 


如 果 数 据 库 中 没有 任何 数据 ， 希 望 隐 忠 新 闻 子 段 绑 定 的 行 ， 并且 显示 “目前 没 
有 任何 狐 闻 ”的 文子 说 明 ， 需 要 加 入 显示 区 域 功能 设 首 。 肯 先 选取 记录 集 有 数据 时 要 显示 的 
行 ， 如 图 5-51 所 示 。 


图 5-51 选择 要 显示 的 记录 所 在 的 行 


单 击 “ 应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 “+” 号 按钮 ， 在 弹出 的 
菜单 列表 中 ， 选 择 “ 显 示 区 域 /如果 记录 集 不 为 空 则 显示 区 域 ”选项 。 

打开 “如 果 记 录 集 为 空 则 显示 区 域 ” 对 话 框 ， 你 持 献 认 值 ， 单 击 “ 确 定 ” 按 钮 
回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 显示 的 区 域 左 上 角 出 现 了 一 个 “如 果 人 符合 此 条 件 则 显 
示 .…” 的 灰色 和 疮 标 ， 这 表示 已 经 完成 设置 。 设 置 及 效 末 如 图 5-52 所 示 。 


节 当 从 邓 集 趟 为 空 则 显示 区 其 
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图 5-52 ”设置 及 效果 


接 下 来 选中 记录 集 没 有 数据 时 要 显示 的 行 ， 如 图 5-53 所 示 。 


本 前 流 有 性 何 新 闻 


图 5-53 ”选中 没有 数据 时 显示 的 区 域 


单 击 “ 应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 
的 荣 单列 表 中 ， 选 择 “ 显 示 区 域 / 如 朱 记 录 集 为 空 则 显示 区 域 ” 选 项 。 打 开 “ 如 果 记 录 集 为 
空 则 显示 区 域 ” 对 话 框 ， 保 持 默认 值 ， 如 图 5-54 所 示 。 单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 
将 发 现 先前 所 选中 要 显示 的 区 域 堪 上 角 出 现 了 一 个 “如 末 符 合 此 条 件 则 显示 …” 的 灰色 疮 
标 ， 这 表示 已 经 完成 设 定 。 


节 津 侣 杀 集 为 空 则 显示 区 其 


图 5-54 ”设置 “如 果 记 录 集 为 空 则 显示 区 域 ” 对 话 框 


の 


接 下 来 插入 “记录 集 导航 条 ”功能 ， 把 ha 
展 标 移 至 要 加 入 “记录 集 导 航 条 ”的 位 置 ， 单 击 “ 插 恒 。 导入 表格 式 数据 人 
入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 和 集 导 航 条 ” pe 
按钮 总， 如 图 5-55 所 示 。 [去 Spry 重复 项 

打开 “记录 集 导航 条 ”对 话 框 ， 单 击 先 ee 
择 “ 记 录 集 ”后 面 的 下 拉 三 角 按钮 ， 在 下 拉 菜 单 中 先 @ 9s 
择 rs xnews 记录 集 ， 然 后 再 单 击 选择 “显示 方式 ” 为 ee 
“文本 ” 单 选 按钮 ， 最 后 单 击 “ 确 定 ” 按 钮 回 到 编辑 ee 。 

ぐぅ ”记录 和 集 分 页 : 记录 集 导 航 条 


页 面 ， 将 发 现 页 面 中 目 动 插入 记录 集 的 导航 条 ， 如 儿 
5-56 所 示 。 图 5-55 选择 搬入 记录 集 导 航 条 按钮 


和 新闻 中 山 | 


如 果 符 合 此 条 件 则 显示 . 


图 5-56 ”添加 记录 集 导 航 条 


在 news.asp 页 面 中 除了 显示 网 站 中 所 有 的 新 闻 标题 外 ， 还 要 为 浏览 者 提供 单 
击 新 闻 标题 内 容 可 链接 至 详细 内 容 页 的 功能 ， 因 此 需要 加 入 “ 转 到 详细 页 面 ”服务 器 行为 。 
首先 选中 {rs_xnews.title} 字 段 ， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 
号 “+” 按钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ”的 选项 ， 如 图 5-57 所 示 。 


图 5-57 ”选择 狐 闻 标 题字 段 


打开 “ 转 到 详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 
框 ， 选 择 news 文件 夹 中 的 newscontent.asp， 其 他 设 定 值 丝 不 改变 其 默认 值 ， 如 图 5-58 所 示 。 


转 和 到 详细 页 面 


链接 : 
详细 信息 页 : newscontent. asp 下 


传递 EL 参数 : Tn | 设置 为 以 下 项 的 值 
记录 集 加 | rs _Xnews AAA 
列 : Tn | 


传递 现 有 参数 : [] WRL 和 参数 
口 ] 表单 参数 


图 5-58 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 返回 编辑 页 面 ， 现 在 系统 主页 面 news.asp 的 制作 已 经 完 
成 ， 按 F12 键 可 以 打开 正 浏 览 器 预览 目前 制作 的 效果 ， 如 图 5-59 所 示 。 
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图 5-59 ”系统 主页 面 的 设计 效果 


天 并 恒 新 闻 内 容 J 面 


制作 新 闻 的 详细 内 容 页 面 newscontent.asp， 这 个 页 面 的 功能 用 于 显示 浏览 者 单 击 新 闻 标 
题 时 打开 的 详细 新 闻 内 容 。 设 计 的 重点 在 于 如 何 接收 主页 面 news.asp 所 传递 的 参数 ， 并 根据 
这 个 参数 显示 数据 库 的 记录 内 容 ， 新 闻 内 容 页 面 的 版 面 设计 效果 如 网 5-60 所 示 。 
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图 5-60 产 闻 内 容 页 面 设 计 效 末 


ー ビデ 」 


Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


详细 操作 步骤 如 下 : 
启动 Dreamweaver CS5， 设 计 静 态 的 页 面 效 果 如 图 5-61 所 示 。 
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5-61 新闻 内 容 页 面 设计 


单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 ( 查 
询 )” 和 选项。 打开“ 记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 ， 
如 图 5-62 所 示 。 


冰 称 : rs content 
表格 ; 


列 : で ) 全部 。 馈 选 定 的 : 


WF aa 司 


$-62 設定 rs content 记录 集 


@ 在 “名 称 ” 文 本 框 中 输入 rs content 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 讽 普 “和 莽 选 ”的 条 件 为 “ID=URL 参数 /ID ”。 

@ 在 “排序 ”下 拉 列 表 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 


新 闻 系 统 


绑 定 记录 集 后 ， 将 记录 集中 的 {rs_content.titleY 和 {rs_content.content} 字 上段 插 入 
全 newscontent.asp 外 而 的 适当 位 置 ， 如 图 5-63 所 示 。 
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$-63 ”将 相应 字段 的 插入 


设置 完毕 后 先 打开 index.asp 页 面 ， 按 下 F12 键 单 击 其 中 第 一 个 标题 ， 得 到 打 
开 的 详细 新 闻 内 容 页 面 ， 效 果 如 图 $-64 所 示 。 
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塌 埠 辣 司 用 所 有 量 生 的 得 万 二 ， 让 我 们 看 看 神 们 的 性 性 比 面 二 高 到 。 


$-64 浏览 效果 图 


il 


台 管 理 


狐 闻 系统 的 后 台 官 理 系 统 对 于 带 有 新 闻 系 统 的 网 站 非常 重 要 ， 因 为 新 闻 要 你 持 实 时 性 。 
官 理 者 可 以 登录 后 台 ， 实 时 增加 、 修 改 或 删除 数据 库 中 的 新 闻 内 容 ， 使 网 站 能 随时 你 持 最 
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新 、 最 实时 的 信息 。 后 台 管 理 主页 面 的 效果 如 图 5-65 所 示 。 


soft Jnternet xploror 
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5-65 ”将 要 制 作 的 后 全 管理 主页 面 


引 后 台 登 录 页 面 


由 于 管理 者 接口 是 不 允许 网 站 浏览 者 进入 的 ， 因 此 必须 为 管理 者 设置 权限 。 我 们 可 以 利 
用 登入 账号 与 密码 实现 这 个 功能 ， 详 细 操 作 步 又 如 下 : 

局 动 Dreamweaver CSS， 执 行 沫 单 栏 中 的 “文件 ”一 “新 建 ” 人 命令， 打开“ 新 
建文 要 ”对 话 框 ， 选 择 “ 罕 昌 页 ”选项 卡 中 的 “页 面 类 型 ”列表 框 下 的 ASP VBScript 选 
项 ， 在 “布局 ”列表 框 中 选择 “无 ”选项 ， 然 后 单 击 “创建 ”按钮 创建 狐 页 耐 ， 输 入 网 页 标 
题 “ 后 人 台 管 理 登 录 ” 执行 灯 单 栏 中 的 “文件 ”一 “保存 ”命令 ， 在 站 点 中 将 该 文档 你 存 为 
admin login.asp。 

执行 荣 单 栏 中 的 “插入 ”一 “表单 ”一 “表单 ”命令 ， 插 入 一 个 表单 。 

将 鼠标 指针 放置 在 该 表单 中 ， 执 行 来 
单 栏 中 的 “搬入” 一“ 表格” 命令， 打开 “表格 ” 
对 话 框 ， 在 “ 行 数 ” 文 本 框 中 输入 需要 插入 表格 的 
行 数 为 4。 在 “ 列 数 ” 文 本 框 中 输入 需要 插入 表格 
的 列 数 为 2。 在 “表格 宽度 ”文本 框 中 输入 400， 
单位 选择 “像素 ”。 其 他 参数 保持 默认 值 ， 如 网 5-66 
所 示 。 


辅助 功能 一 一 一 


单 击 “确定 ”按钮 ， 在 该 表单 中 插入 | 


4 行 2 列 的 表格 ， 选 择 表 格 并 在 “属性 ”面板 中 设 ”I 


置 对 齐 方式 为 居中 对 齐 。 单 击 和 鼠标 左 键 并 拖 忠 鼠标 | ー 
选择 第 1 行 表格 ， 选 中 表格 的 第 1 行 后 , 在 “ 属 上 上 ご = 
性 ”面板 中 单 击 “ 合 并 所 选单 元 格 ， 使 用 跨度 ” 按 图 5-66 插入 表格 


取消 
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钮 中， 将 第 1 行 表格 合并 。 用 同样 的 方法 把 第 4 行 合 并 。 得 到 的 效果 如 图 5-67 所 示 。 
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下 下 


<body> <form#forml > 584 x 148v 3 下 站 1 秘 简体 中 站 (6B2312) 


5-67 合并 单元 格 


在 该 表格 中 的 第 1 行 中 输入 文字 “后 台 管 理 ”， 在 表格 第 2 行 的 第 1 个 单元 
格 中 输入 文学 说 明 “ 用 户 :”， 在 第 2 行 表格 的 第 2 个 单元 格 中 单 击 “ 文 本 域 ” 按 钮 四， 
插入 单行 文本 域 表 单 对 象 ， 定 义 文 本 域名 为 username。“ 文 本 域 ”属性 设置 及 此 时 的 效果 
如 图 $-68 所 示 。 


RE 上 
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で ni chapos news\admin_ login asp (KHTML)* = 回 
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ody> <form. .. > <table> <tr>Ktd2 [kD Q 100X 584x148v3K/1 秒 簡体 中 文 (GB2312)  .;; 
5-68 输入 “用 户 ” 名 和 插入 “文本 域 ” 的 设置 和 效果 图 
在 表格 第 3 行 的 第 1 个 单元 格 中 输入 文子 说 明 “ 和 密码: ”， 在 表格 第 3 行 的 第 2 


个 单元 格 中 单 击 “ 文 本 域 ” 投 钮 加 ， 插 入 单行 文本 域 表 单 对 象 ， 定 义 文本 域名 为 password。 
“文本 域 ”属性 设置 及 此 时 的 效果 如 图 5-69 所 示 。 
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5-69 输入 “密码 ”名 和 插入 “文本 域 ” 的 设置 及 效果 
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单 击 选择 第 4 行 单元 格 ， 执 行 菜单 栏 中 的 “插入 ”一 “表单 ”一 “按钮 ” 合 
令 ， 执 行 两 次 该 命令， 插入 两 个 按钮 ， 并 分 别 在 “属性 ”面板 中 进行 属性 变更 ， 将 一 个 按钮 
的 “动作 ”设置 为 “提交 表单 ” 单 选 按钮 ， 另 一 个 设置 为 “ 重 设 表单 ” 单 选 按钮 ,“ 属 性 ” 
面板 中 的 具体 参数 设置 及 效果 如 图 5-70 所 示 。 
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图 5-70 ”设置 按钮 名 称 的 属性 及 效果 


单 击 “应 用 程序 ” 睾 板 中 的 “服务 器 行为 ”标签 中 的 “+” 瑟 按钮 ， 在 弹出 的 
玉 单 列表 中 选择 “用 户 映 份 验证 /登录 用 户 ” 的 选项 。 

打开 “登录 用 户 ” 对 话 杠 ， 进 行 如 下 设置 : 

@ 从 “从 表单 获取 输入 ”下 拉 末 早 中 选择 该 服务 右 行 为 使 用 网 页 中 的 forml 表单 对 象 中 
浏览 者 填写 的 对 象 。 

@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 username 对 象 ， 议 定 该 用 户 登 录 服 务 器 行 
为 的 用 户 名 数据 来 源 为 表单 的 username 文本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 该 用 户 登 录 服 务 器 行为 
的 用 户 名 数据 来 源 为 表单 的 password 文本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
news。 

@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 占 行为 使 用 到 的 数据 库 表 对 象 为 user。 

@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 user 存储 用 户 名 的 字段 为 username 字段 。 

@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 user 存储 用 户 密码 的 字段 为 password 字段 。 

@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 问 admin.asp 页面 。 

@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 问 ../index.asp 页 面 。 

@ 选择 “基于 以 下 项 限制 访问 ”后 面 的 “用 户 名 和 密码” 单 选 按 钮 。 

设置 如 图 5-71 所 示 。 


执行 染 单 栏 中 的 “窗口 ”一 “行为 ”命令 ， 打 开 “ 行 为 ”面板 ， 单 击 “ 行 为 ” 
面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 行为 列表 中 ， 选 择 “ 检 得 表单 ”命令 ， 打 开 “ 检 得 表 
单 ” 对 话 框 ， 将 usemame 和 password 文本 域 的 人 都 设置 为 “ 必 和 需 的 ”在 “可 接受 ”区 域 移 
择 “ 任 何 东 西 ” 单 选 按 钮 ， 设 置 如 图 $-72 所 示 。 


从 表单 获 职 输入 :51 
用 户 名 字段 : |usernane | 
密码 字段 : |password 。。 マツ 
使 用 连接 验证 : nsws v 
表格 : sr ~ 
用 户 名 列 : | usernane | 
[| 转 到 前 一 个 URL( 如 果 它 存在 ) 值 ， 回 必需 的 
如 果 登 录 失 败 ， 转 到 :| /index.asp = 
基于 以 下 项 限制 沪 问 : ”用户 名 和 密码 


O 可 接受 : ”任何 东西 
用 户 名 、 密 码 和 访问 级 别 
获 职 级别 自 : 〇 电子 邮件 地 址 〇 数字 | | 到 | | 


$-71 登录 用 户 的 设 定 $-72 ”设置 检查 表单 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 管 理 者 登录 页 面 admin login.asp 已 经 制作 
完成 ， 完 成 后 的 效果 如 图 $-73 所 示 。 
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图 5-73 设置 管理 进入 界面 


只 


管理 系 统 后 台 主 页 面 是 在 系统 管理 者 登录 验证 成 功 后 ， 所 进入 的 页 面 。 在 该 负面 中 管理 
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者 可 以 实时 新 培 、 修 改 或 删除 数据 库 的 新闻 内 容 ， 使 网 站 能 随时 你 持 最 刹 、 最 实时 的 信息 。 
系统 管理 主页 面 admin.asp 的 内 容 设计 与 系统 主页 面 news.asp 大 致 相同 ， 不 同 的 是 增加 了 可 
以 链接 到 纺 辑 页 面 的 “修改 ”和 “删除 ”文字 链接 ， 毅 态 部 分 的 页 面 结 构 如 网 $-74 所 示 。 
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5-74 页 面 静态 效 末 


详细 操作 步骤 如 下 : 

与 系统 主页 面 news.asp 相同 ， 系 统管 理 后 台 主 页 面 admin.asp 也 要 显示 数据 库 
的 所 有 新 闻 数 据 ， 但 是 两 者 的 目的 是 有 差别 的 ， 前 者 的 目的 是 为 浏览 者 提供 所 有 的 新 闻 标 题 
内 容 并 通过 单 击 可 链接 至 详细 内 容 页 ， 后 者 的 目的 则 是 为 管理 者 提供 修改 或 删除 数据 的 功 
能 。 接 下 来 开始 动态 部 分 的 设计 ， 首 先 单 击 “ 绑 定 ” 面 板 ， 并 在 面板 中 单 击 “ 增 加 绑 定 ” 鬼 
钮 “+”， 在 弹出 的 菜 音 中， 选择“ 记录 集 〈 得 询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “确定 ” 按 钮 完成 设 定 ， 
如 图 5-75 所 示 。 


这 


$-75 設定 rs admin 记录 集 


第 5 章 @ 本 和 


@ 在 “名 称 ” 文 本 框 中 输入 rs admin 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 来 里 中 选择 news 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 玉 时 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 在 “ 列 ” 栏 中 选择 “全 部 ” 单 选 按钮 。 © 

@ 设置 “人 沛 选 ” 的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 末 单 中 选择 “ID” 选 项 ， 然 后 选择 “升序 ”的 排列 顺序 。 

绑 定 记录 集 后 ， 将 记录 集中 的 {rs_admin.ID} 、 frs admin.title} 以 及 
frs_admin.time} 字 段 插 入 至 admin.asp 网 页 的 适当 位 置 ， 如 图 5-76 所 示 。 


新 闻 由 响 


r-----------------------------------------------------------------] 


PT TIi lrs_admin. title} 人 rs_admin. time] ”修改 册 阶 


图 5-76 ”记录 和 集 的 字段 插入 全 news admin.asp 网 页 


由 于 news_admin.asp 页 面 需要 显示 数据 库 中 的 所 有 记录 ， 而 目前 的 设 定 则 只 
能 显示 数据 库 的 第 一 条 数据 ， 需 要 加 入 “服务 喜 行 为 ”中 的 “重复 区 域 ” 功 能 ， 单 击 选 中 
admin.asp 页 面 中 需要 重复 的 行 ， 如 网 $-77 所 示 。 


{rs_admin. ID} {rs_admin. titlel} {rs_admin. timel 慷 路 册 降 


图 5-77 选择 重复 的 行 


单 击 “ 应 用 程序 ”和 面板 群 组 中 的 “服务 此 行为 ”和 面板， 并 在 面板 中 蛙 击 “增加 
服务 右 行 为 ”和 面板 中 的 加 写 “+” 控 钮 。 在 弹出 的 末 时 中， 选择 “重复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 8， 如 图 5-78 
所 示 。 

单 击 “ 确 定 ” 按 钮 回 到 编辑 页 耐 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 左 上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 图 5-79 所 示 。 


新 闻 中 山 | 


ーー 


图 $-78 选择 记录 集 显示 的 记录 为 8 图 5-79 设 定 完成 的 效果 
接 下 来 要 在 admin.asp 中 加 入 “记录 集 导 航 条 ”功能 ， 使 系统 可 以 分 页 显示 所 


有 新 闻 。 鼠 标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 
中 的 “记录 集 导航 条 ”按钮 如， 单 击 “确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 页 面 出 现 该 记录 


记录 集 写 肌 条 


{rs admin. IDN} {rs_admin. title} {rs_admin. timel ”个 改 删除 
加 果 术 :如果 罕 :加 果 罕 :如 果 符 合 此 条 件 则 显示 ... 


接着 要 插入 “记录 集 导航 状态 ”把 鼠标 移 至 要 加 入 “记录 集 导 航 状态 ”的 位 
置 ， 单 击 “插入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导航 状态 ”按钮 刚 ， 打 开 “ 记 录 集 
导航 状态 ”对 话 框 ， 在 “记录 集 ” 下 拉 列 表 中 选择 rs_admin， 再 单 击 “ 确 定 ” 按 钮 回 到 编辑 
页 面 ， 将 发 现 页 面 中 目 动 插入 记录 集 导 航 状 态 ， 如 图 $-81 所 示 。 


记 承 集 号 肌 状 态 


frs_ admin.titlsi rs_admin. timei 惧 改 删 际 


图 5-81 插入 “记录 集 导航 状态 ” 


admin.asp 页 面 主要 是 使 管理 者 能 够 链接 全 编辑 页 面 ， 并 对 新 闻 进 行 新 增 、 修 
改 与 删除 等 操作 。 因 此 需要 在 网 员 中 加 入 说明 文字 让 管理 者 能 方便 地 进入 相应 的 页 面 进 行 管 
理 ， 设 计 这 个 页 面 的 4 个 连接 如 下 : 

@ 标题 字段 {rs admin.title} 链 接 的 对 象 为 newscontent.asp: 

@“ 新 增 新 闻 ” 文 学 链接 的 对 象 为 news add.asp 


(新 闻 系 统 


@“ 修 改 ” 文 学 链 接 的 对 和 象 为 news upd.asp 
@“ 有 删除” 文字 链接 的 对 象 为 news del.asp 


首先 选中 “新 增 新 闻 ”， 在 “属性 ”面板 中 将 它 连接 到 news 文件 夹 中 的 Sy 


news add.asp 负面 ， 如 图 5-82 所 示 。 z 
rt rr = し 
| 1THL | 燈 式 ) | 段 w | 类 -= 


B33 


图 $-82 ”指定 “新 增 新 闻 ” 的 链接 


选中 “修改 ”文字 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 
“+” 按 钮 ， 在 弹出 的 染 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 

打开 “ 转 到 详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ” 按 钮 打开 “选择 文件 ”对 话 框 ， 
选择 news 文件 夹 中 的 /news/news_upd.asp， 其 他 设 定 值 皆 不 改变 其 默认 值 ， 如 图 $-83 所 示 。 


链接 : | 所 选 范 围 : “修改 
详细 信息 页 : |/news/news_upd. asp 


设置 为 以 下 项 的 值 


v 


传递 URL 参 数 : ID 


列 : Tn vy 
传递 现 有 参数 : [] mr 参数 
表单 参数 


图 5-83 “修改 ”文字 的 “ 转 到 详细 页 面 ” 对 话 框 设置 


选中 “删除 ”文子 并 重复 上 和 耐 的 操作 ， 要 转 到 的 详细 信息 页 为 /news/news_ 


delasp， 如 图 5-84 所 示 。 


链接 :| 所 选 范围 :“ 册 除 ” 
详细 信息 页 : |/news/news_del. asp 


| 设置 为 以 下 项 的 值 


ww 


传递 URL 参 数 : ID 
记录 集 : rs_admin 


到 |: ID v 


传递 现 有 参数 : [ ] WRL 参数 
[表单 参数 


图 5-84 “删除 ”文字 的 “ 转 到 详细 页 面 ” 对 话 框 设置 


再 选中 标题 字段 frs_admin.title} 并 重复 上 面 的 操作 ， 将 “详细 信息 页 ”设置 为 
/news/newscontent.asp， 如 图 5-85 所 示 。 


-二 
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链接 : | 所 选 范围 : "<%= (rs_admin. Field: マ | 
详细 信息 页 : | news/newscontent. asp | 人 症 .| 


传递 URL 参 数 : ID ”设置 为 以 下 项 的 值 


记录 集 ranin oo {tt 


列 : Tn vY | 
传递 现 有 参数 : [ ] yRL 参数 
[表单 参数 


5-85 {rs_admin.title} 学 段 的 “ 转 到 详细 页 面 ” 对 话 框 设置 


百合 管理 只 有 管理 人 员 输 入 正确 的 账号 与 密码 才 可 以 进入 ， 所 以 对 本 页 的 访问 
功能 必须 设置 限制 。 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 
在 弹出 的 菜单 列表 中 ， 选 择 “ 用 户 喘 份 验证 /限制 对 页 的 访问 ”的 选项 。 

在 打开 的 “限制 对 页 的 访问 ”对 话 框 中 选择 “用 户 名 的 密码 ” 蛙 选 授 钮 ， 在 
“如 果 访 问 被 拒绝 ， 则 转 到 ”文本 框 中 输入 ../index.asp， 表 示 如 果 访 问 被 拒绝 则 转 到 首页 ， 设 
置 如 网 5-86 所 示 。 


〇 ”用 户 各、 密码 和 访问 级 别 


选 职 级 别 : 


如 果 访 问 被 拒绝 ， 则 转 到 : |. . /index. asp 


图 5-86 设置 “限制 对 页 的 访问 ”对 话 框 


至 此 ， 系 统管 理 后 台 主 页 面 admin.asp 的 设计 与 制作 已 经 完成 ， 从 后 台 登 录 后 
预览 制作 效果 ， 如 图 5-87 所 示 。 
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图 5-87 管理 页 面 效果 图 


本 节 将 介绍 如 何 制作 新 增 新 闻 的 页 面 news add.asp， 访 页 面 主要 的 功 


数据 增加 到 网 站 的 数据 库 中 ， 页 面 设计 如 图 5-88 所 示 。 
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图 5-88 ”新 增 新 闻 页 面 
评 细 操作 步 又 如 下 : 


是 将 页 面 的 表单 ウー 


uid ロニ 


在 news add.asp 编辑 页 面 中 ， 执 行 菜单 栏 中 的 “窗口 ”一 “服务 器 行为 ” 命 
令 ， 打 开 “ 服 务 器 行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 菜 时 中 选择 “插入 


记录 ”命令 ， 同 该 网 页 搬入 记录 的 服务 融 行 为 。 
打开 “插入 记录 ”对 话 框 ， 按 下 面 的 参数 进 4 


FE 
插入 到 表格 : 

AL |[」 
获 职 值 自 : | Eorm1 [在 提 变 时 ) 


title A title' Cr 本 ) 
E 中 “content" 【了 本 ) 


mu < 
提 变 为 : 文本 


$-89 ” 设 定 “插入 记录 ”对 话 框 

@ 从 “连接 ”下 拉 列 表 中 选择 news 连接 对 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 news 数据 表 

@ 在 “插入 后 ， 转 到 :” 栏 中 输入 admin.asp， 表 示 揪 入 成 功 后 返回 该 页 面 。 


行 设置 ， 如 图 $-89 所 示 。 
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@ 从 “获取 值 目 ”下 拉 末 单 中 选择 建 并 的 forml 表单 对 象 。 

@ 在 “表单 元 素 ” 列 表 框 中 把 表单 中 的 字段 和 数据 库 中 的 字段 一 一 对 应 。 

单 击 “ 确 定 ” 投 钮 回 到 编辑 页 面 ， 则 完成 news_add.asp 页 面 插入 记录 的 设计 ， 
效果 如 网 5-90 所 示 。 
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$-90 ”完成 的 设计 


東上 修改 新 闻 页 面 


设计 修改 新 闻 的 页 面 news_updasp， 这 个 页 面 的 主要 功能 是 将 数据 库 的 现 有 数据 达到 页 
面 的 窗口 进行 修改 ， 修 改 数据 后 再 更 独到 站 点 的 数据 库 中 。 页 面 设计 如 图 5-91 所 示 。 
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5-91 修改 新 闻 页 面 


统 


评 细 操作 步 又 如 下 : 

打开 news upd.asp 页 面 ， 单 击 “ 绑 定 ” 面 板 ， 并 在 面板 中 单 击 “增加 绑 定 ” 
按钮 “+”， 在 弹出 的 采 单 中 ， 选 择 “ 记 录 集 (但 询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参 
数 进行 议 置 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 ， 如 网 


$-92 所 示 。 连接 ー 
@ 在 “名 称 ” 文 本 框 中 输入 rs upd 作为 该 | 2 
记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 
连接 对 象 。 
@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 
库 表 对 象 为 news。 
@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按 
旬 。 图 5-92 设 定 rs_upd“ 记 录 集 ”对 话 框 


@ 设置 “ 沛 选 ” 有 的 条 件 为 “ID=URL 参数 有 D”。 

@ 在 “排序 ”下 拉 末 单 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 

绑 定 记录 集 后 ， 将 记录 集中 的 {rs upd.title} 和 (rs upd.content} 字段 插入 至 
news upd.asp 网 页 的 适当 位 置 ， 如 图 5-93 所 示 。 


DV 文 弟 中 而 组 2) 查看 [y) 装 入 ) 禁忌 人 W) 格式 0) 人 名 生 CC) 站 点 仔 ) 田口 W) 帮助 00) br ex 


人 ms wp sirle csr 
| 野人 | やけ | 5 は 代 8 に て 。 因 抽 田 」、 必 策 。 本 忆 、 口 。。 于 是 ， 届 加 5 俯 


(coatiat) 


ne 


EO 


MT 


CE 


类 于 (7 单行 5) OEFmW OEY 

Wi 人 = Gs_ upd Finids ITomfeosteas ¥ 
RAO 
DR 


本 TH BR SE CE 


图 5-93 ”字段 的 搬入 


完成 表单 布置 后 ， 要 在 news upd.asp 页 面 中 加 入 “服务 器 行为 ”中 “更 新 记 
录 ” 功 能 ， 在 news upd.asp 页 面 中 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 
写 “ 二 ”按钮 。 在 弹出 的 菜单 列表 中 选择 “更 新 记录 ”选项 。 

在 “更 新 记录 ”对 话 框 中 ， 按 下 面 参数 进行 设置 ， 如 图 5-94 所 示 。 

@ 从 “连接 ”下 拉 来 单 中 选择 news 连接 对 象 。 


连接 : EWS 
要 更 新 的 表格 news 
选 职 记 录 自 : rs 


唯一 键 列 : 


vy 区 数值 


在 更 新 后 ， 转 到 : |../index. as 


| 


获 职 值 自 : | Eorm 


Y 三 提交 时 ) 


表单 元 素 : 


到 |: title 


提交 为 : | 文本 


$-94 


设 定 “更 新 记录 ”对 话 框 


@ 从 “要 更 新 的 表格 ”下 拉 列 表 中 选择 news 数据 表 。 
@ 从 “获取 记录 目 ” 下 拉 束 单 中 选择 建立 的 rs_upd 记录 集 。 
@ 从 “唯一 键 列 ”下 拉 列 表 中 选择 ID， 并 单 击 选择 “数值 ” 复 选 框 。 


@ 在 “在 更 新 后 ， 转 到 : ” 栏 中 输入 .Vindex.asp， 表 示 插 入 成 功 后 返回 该 页 面 。 
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@ 从 “获取 值 目 ”下 拉 列 表 中 选择 建立 的 forml 表 単 対象 。 
@ 在 “表单 元 系 ” 列 表 框 中 把 表单 中 的 字段 和 数据 库 中 的 字段 一 一 对 应 。 
单 击 “确定 ”按钮 加 到 编辑 页 面 后 ， 即 完成 设 定 ， 如 图 5-95 所 示 。 
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图 5-95 ”加 入 更 新 记录 后 的 效果 


最 后 介绍 用 于 删除 新 闻 的 页 面 news_delasp， 该 页面 的 界面 和 修改 新 闻 的 页 面 震 不 多 ， 
只 是 其 功能 是 将 表单 中 的 数据 从 站 点 的 数据 库 中 删除 。 
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删除 新 闻 页 面 如 图 5-96 所 示 。 
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图 5-96 ”删除 页 面 的 设计 


许 细 操作 步骤 如 下 : 

打开 news delasp 页 面 ， 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 荣 
单 中 选择 “记录 集 (查询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 投 钮 完成 设 定 ， 
如 图 5-97 所 示 。 

@ 在 “名 称 ” 文 本 框 中 输入 rs_del 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 设置 “ 沛 选 ” 的 条 件 为 “ID=URL 参数 /ID”。 

@ 在 “排序 ”下 拉 菜 单 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 


be del 
人 


列 : で ) 全部 し 选 定 的 : 


图 5-97 设 定 rs_del 记录 集 
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绑 定 记录 和 集 后 ， 将 记录 集 的 字段 插入 全 news del.asp 网 页 的 适当 位 置 ， 如 图 
5-98 所 示 。 


= i | Bi * Fe 


| Bis ab, ei 
| i wi pt ma 


FPPLTT HI 
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图 5-98 ”字段 的 插入 


完成 表单 的 布置 后 ， 要 在 news delasp 负面 中 加 入 “服务 器 行为 ”中 的 “删除 
记录 ”功能 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 “+” 号 按钮 。 在 弹出 的 
及 单列 表 中 ， 选 择 “ 删 除 记 录 ” 选 项 。 

打开 “删除 记录 ”对 话 框 ， 根 据 下 面 的 参数 进行 设置 : 

@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 产 连 接 对 象 。 

@ 从 “从 表格 中 删除 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 从 “选取 记录 目 ” 下 拉 列 表 中 ， 选 择 rs_del 记录 集 。 

@ 从 “唯一 键 列 ”下 拉 列 表 中 选择 ID 字段 ， 并 单 击 选择 “数值 ” 复 选 杠 。 

@ 在 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 forml 表单 。 

@ 在 “删除 后 ， 转 到 ”文本 框 中 输入 删除 后 转 到 的 页 面 为 .Jindex.asp。 

完成 设置 的 对 话 框 如 图 5-99 所 示 。 


J 
i 


唯一 刍 列 数值 
提交 此 昌明 除 
出 除 后 ， 转 到 


$-99 ” 设 定 “删除 记录 ”对 话 框 


靳 闻 系统 


单 击 “ 确 定 ” 按 钮 回 到 编辑 负面 ， 即 完成 删除 狐 闻 页 面 的 制作 如 图 5-100 
所 示 。 


© 


动 江 文 素 天 (title) 
融 咒 廊 市 十 (csntsnu) 


1 年 本 欄 項 


图 5-100 “删除 记录 效果 图 
全 此 ， 则 完成 了 整个 新 闻 系 统 的 制作 。 


线 投票 系统 也 是 网 站 最 第 用 的 系 
统 之 一 。 网 站 可 以 通过 网 站 在 线 投票 功 
能 做 一 些 调 但 工作 。 本 章 将 详细 介绍 网 


a 该 系统 用 直观 的 图 形 
化 界面 显示 投票 信息 ， 以 及 即时 查看 投 
票 情况 等 技术 。 实 例 中 的 技术 核心 在 于 
使用 ASP 编写 程序 实现 投票 累加 的 方 
法 和 使 用 ASP 编写 程序 实现 图 形 化 显 
示 投 票 结果 的 方法 。 


了 到 


教学 重点 


投票 系统 的 规划 与 设计 に 
投票 系统 数据 库 的 设计 連 
投票 动态 页 面 的 开发 に 
计算 投票 的 方法 7 
显示 投票 结果 的 设计 に 
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搭建 投票 系统 开发 平台 


投票 系统 一 般 应 用 于 大 型 的 动态 网 站 ， 在 网 站 的 首页 单独 列 出 一 个 模块 用 于 用 户 登 录 使 
用 ， 因 此 开发 在 线 投票 系统 首先 要 制作 相关 的 静态 网 页 效果 。 投 票 系统 在 网 站 首页 的 位 置 如 
图 6-1 所 示 。 


6-1 投票 系统 在 网 站 首页 的 位 置 


在 设计 的 过 程 中 首页 的 布局 需要 以 下 儿 个 环 方 : 建立 本 实例 的 站 点 chap06, 使用 
Photoshop 分 割 图 片 ， 配 置 IS 站 点 浏览 ， 使 用 div+CSS 布局 静态 页 面 。 


6.1.1 使用 Photoshop CS5 分 割 图 所 


下 面 束 开始 用 Photoshop CSS 切片 工具 分 割 首页 图 片 。 

站 和 完 在 本 地 计算 机 D 盘 建 立 站 点 文件 夹 chap06， 在 站 点 文件 夹 里 建立 一 些 常 
用 文件 夹 如 css、images、psd 文件 夹 。 然 后 从 交往 中 找到 站 点 chap06/psd 文件 夹 下 的 
index.psd 文件 ， 将 其 复制 到 本 地 站 点 psd 文件 来 中 。 

启动 Photoshop CS5， 选 择 菜 单 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开 首 页 
index.psd 文件 ， 可 分 割 的 效果 如 图 6-2 所 示 。 

井 始 分 割 各部 分 圏 片 , 首 先 分 割 最上 面 的 Logo 所 在 行 的 图 片 ， 单 击 工 具 箱 中 
的 “切片 工具 ”按钮 | 和 襄 ， 单 击 鼠 标 左 键 从 场景 的 左上 角 拖 中 到 标题 的 右 下 角 ， 如 图 6-3 所 
示 ， 图 中 绘制 的 虚线 框 就 是 切片 大 小 ， 切 片 后 左上 角 会 显示 一 个 国 国 图 标 。 

保持 “切片 工具 ”按钮 | 加 选中 状态 ， 按 下 快捷 键 Crl+H) 组 合 键 ， 打 开 辅 助 
线 视图 ， 可 以 先 用 辅助 线 分 割 好 需要 分 割 的 区 域 ， 按 照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 9 
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个 小 图 片 ， 如 图 6-4 所 示 。 
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图 6-3 Logo 部 分 的 切片 效果 
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6-4 切片 整个 首页 的 效果 


选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “が 散 ” 模式 , 
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“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 6-$ 所 示 。 


着 峭 为 Wmb 和 设 阁 所 用 巾 式 


RF 
19E 
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6-5 


“存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “ 储 存 ” 控 钮 打开“ 将 优化 结果 存储 为 ”对 话 框 ， 蛙 击 选 择 “ 你 存 
在 ” 右 侧 的 下 拉 三 角 按 钮 ”， 选 择 建立 的 chap06 文件 来， 其 他 参数 保持 默认 值 ， 如 图 6-6 


所 示 。 


将 优化 结果 存 博 为 
保存 在 I): | 3 chsp06 


| images 
Drsd 


index. html 


HTML 和 図 像 Gt.html) マ 


文件 名 ) : 
保存 类 型 て ) : 


设置 : 默认 设置 マ 
切片 : 选中 的 切片 マ 


6-6 “将 优化 结 朱 存储 为 ”对 话 框 设 置 


保存 ⑤) 
取消 


单 击 “保存 ”按钮 ， 完 成 保存 切片 的 操作 。 打 开 文件 傈 存 的 路 径 ， 可 以 看 到 目 
动 生成 了 一 个 名 为 images 的 文件 来 ， 文 件 夹 里 古 前 面 切 片 后 产生 的 小 图 片 ， 由 这 些小 图 片 
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组 成 了 首页 的 效果 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 6-7 所 示 。 
。 5 
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D:\khapOB\images 


本 作为 幻灯 片 查 看 

全 联机 订购 照片 

邓 打印 图 片 | | | | 

る ) 复制 所 有 项 目 开 | cp index_01. jpg index_02. gif index_03. gif index_04. jpe 
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ba 共享 [文件 夹 index_05. jpg index_DB. jpg lmndex_D0T. jpg index_08. jpg 
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index_09. jpg 


6-7 分 割 后 的 小 图 片 


党 配置 投票 系统 站 点 服务 器 


使用 IS 在 本 地 计算 机 上 构建 投票 系统 网 站 的 站 点 ， 配 置 步 又 如 下 : 

首先 启动 IS， 在 IS 窗口 中 ， 用 鼠标 右键 单 击 “ 默 认 网 站 ” 选择 菜单 中 的 
“属性 ”命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 6-8 所 示 。 

单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 人 径 ” 文 本 框 中 设置 站 点 文件 夹 路 径 为 
“Di\chap06”， 其 他 参数 保持 默认 值 ， 设 置 如 图 6-9 所 示 。 


点 认 网 站 属性 
网 站 | ISAPI 筛选 器 | 主 目录 | 文档 “| 目录 安全 性 | TTF 共 | 自 定义 错误 | ) 目录 安全 性 | TTF 头 | 自 定 尺 错误 
网 站 标识 连接 到 资源 时 的 内 容 来 源 : 
描述 @) : TT TE | @ 此 计算 机 上 的 目录 四] 
〇 另 一 台 计 算 机 上 的 共享 (8) 

人 〇 重定 向 到 URL⑪ 
TCF 端 口 (T): a0 | GT 

本 地 路 径 (C): D: chapnB 


连接 口 脚本 资源 访问 ) 加 记录 访问 久 ) 
连接 超时 WI) : gnn | 种 读 取 GR) 索引 資源 ) 


保持 ITTE 连接 (K) 疯 上 (B) 


启用 日 志 记 录 写 ) 应 用 程序 设置 
活动 日 志 格 式 ): 应 用 程序 名 他) : 默认 应 用 程序 册 | 除 是 ) 
W3C 扩展 日 志 交 件 格式 | 属性).… | om 开始 位 置 : < 加 让 网 站 > 
| = = _ - 配置 (G). . . 
执行 权限 企 ): 印 脚 本 v 
应 用 程序 保护 他) : 中 (共用 ) 年 D 载 (L) 


6-8 “默认 网 站 属性 ”对 话 框 6-9 设置 网 站 的 “本 地 路 径 ” 


Dreamvweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


单 击 “ 人 确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 设置 ， 由 于 前 和 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 正 浏览 器 输入 地 
址 http://]127.0.0.1， 即 可 簿 看 页 面 分 割 后 的 效 素 。 如 果 可 以 浏览 到 Photoshop CSS 切片 后 的 
网 页 效果 ， 说 明 站 点 服务 器 配置 已 经 完成 。 


0 创建 编辑 站 点 chap06 : 


使用 Dreamweaver CS5 进行 网 页 布局 设计 ， 首 先 需 要 用 定义 站 点 问 寻 定义 站 点 ， 操 作 步 
又 如 下 : 

打开 Dreamweaver CSS$， 选 择 菜 单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 
“管理 站 点 ”对 话 框 。 

单 击 右边 的 “新 建 ” 按 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ” 对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ”_ chap06。 

“本 地 站 点 文件 夹 ” D:\chap06\。 

如 图 6-10 所 示 。 

单 击 “分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 器 名 称 ” chap06。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ”，D:chap06。 

“Web URL": http://127.0.0.1。 

设置 后 的 “服务 器 ”的 参数 如 图 6-11 所 示 。 


站 点 设置 对 和 锣 chap06 


站 全 Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweawer 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文件 的 计算 机 上 的 本 地 文件 
版 直人 SE 寺村 中 将 相同 文件 发 布 到 web 上 的 服务 器 上 的 远程 文件 支 。 
= 高 


您 可 以 在 此 处 为 Dreamweayer 站 点 选择 本 地 文件 夹 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 夹 : = 


图 6-10 设置 站 点 对 话 框 


“测试 服务 器 文件 ”Di\chap06\。 
“URL 前 级 ”: http://127.0.0.1。 
配置 如 图 6-11 所 示 。 


【在 线 投票 系统 


版 本 控制 服务 器 名 称 :ra | 
* ”高 级 设置 
连接 方法 ;| 本 地 | 网 络 iv 
服务 器 文人 天 :bai | 各 
Web URL 


6-11 “服务 器 ”选项 卡 的 参数 设置 


单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 此 时 ， 在 Dreamweaver CSS 中 已 经 
拥有 了 刚才 设置 的 站 点 chap06。 
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6-12 ”整体 布局 设计 
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使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 修 改 为 标准 的 ASP 文档 格式 ， 将 
</head> 以 上 的 代码 优化 为 如 下 代码 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/EN" "http://www.w3. 
org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet" href="css/style.css" type="text/css"/> 

<title> 上 度假 村 </title> 


其 他 div 的 布局 代码 如 下 : 


<body> 

<div id="top "> 

<div id="logo"><img Src= /images/Iindex 01.jpg"></div> 

<div 1d="banner"> 

<div class="banner1"><a hre 伍 "#"> 首 ”页 |</a> <a hre 伍 #"> 景 点 地 图 |</a> <a hre 伍 "#"> 留 言 咨询 
</a></div> 

<div class="banner2"><a hre 伍 "#"> 前 ”页 </a>/<a hre 伍 "#"> 景 点 推荐 </a>/<a hre 伍 "#"> 团 队 活 动 
</a>/<a hre 仁 /vote.asp"> 有 再 线 投票 </a>/<a hre 伍 "#"> 娱 乐 项 目 </a>/<a hre 伍 "#"> 交 通路 线 </a></div> 

</div> 

</div> 

<div id="mid"> 

<div 1d="zhuce"> 

<div class="username'"> 用 户 名 : 

<input name="textfield" type="text" 1d="textfield" size="10" /> 

</div> 

<div class 

</div> 

</div> 


<div id="news"> 


="password"> 蜜 何 : <input name="textfield2" type="text" id="textfield2" size="10" /> 


<div class="news"> 

<a href="#">2008 年 北京 后 花园 旅游 风景 区 台历 [2008-05-02]</a> <a 
hre 伍 #"> 目 然 风 光一 日 游 :65 元 一 一 75 元 /位 

[2008-03-25]</a> ”<a href 人 ="#"> 浪 漫 山 谷 风 情 交 两 日 游 288 元 /位 

[2008-04-12]</a> ”<a hre 伍 #"> 打 起 鼓 来 敲 起 勉 唆 ! ! 

[2008-06-01]</a> ”<a hre 伍 "#"> 沙 滩 活动 -- 美 丽 的 意外 

[2008-08-08]</a></div> 

</div> 


<div 1d="video"><1img src="/images/index 05.jpg"></div> 


<div id="]jingshen "><img src="/1mages/index 06.jpg"></div> 

<div id="quick"><img src="/1mages/index 07.jpg"></div> 

<div 1d= "touplao"><a href="/vote.asp"><img src="/images/index 08.jpg"></a></div> 
</div> 
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<div 1d="bottom"> 
<div 1d= "copyrlght"><lmg src="/images/index 09.jpg" /></div> 
</div> 


</body> & 


将 制作 的 网 页 布局 文件 保存 为 index.asp 页 面 。 
在 站 点 中 建立 CSS 文件 夹 ， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控 
制 代码 如 下 : 


パパ 页 面 整 体 CSS*/ 


*{ margin:Opx; 


padding:Opx:! 

body{ width: 100%; height:100%; font-size:12px: background:#FFFFFF:;} 
此 设置 幢 面 链接 */ 
a:link { 

color: #000000; 

text-decoration: none: 
} 
a:visited { 

text-decoration: none: 

color:#666666; 
} 
a:hover { 

text-decoration: underhne: 

color: #FF9900: 
} 
a:active { 

text-decoration: none; 

color: #000000: 
} 
な 设置 所 有 图 厂 的 边框 为 0*/ 
img { 

border: 0;} 
な 设置 最 外 层 居 中 显示 ， 实 现 让 整个 页面 居中 显示 */ 
#top,#mid,#bottom{ margin:auto; 

width:998px;} 

な 设置 左 浮动 的 标签 党 
#logo,#banner,#zhuce,#news,#video, 


芍 ingshen,#qulck#touplaof float:left; + 
/*top 部 分 */ 
#banner{ width:759px: 

height:106px: 

background-image:url(/1images/index 02.gif);} 
.bannerl 1 width:165px: 
height: 1 Spx; 
margin-top:4px; 
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margin-left:543px:) 

.bannerl a:hnk { 
color: #000000: 
text-decoration: none: 

} 

.bannerl a:visited { 
text-decoration: none: 
color:#FFF; 

} 

.bannerl a:hover { 
text-decoration: underhne: 
color: #FF9900; 

} 

.bannerl a:active { 
text-decoration: none: 
color: #000000; 

) 

.banner21 width:300px: 

height:20px: 
margin-top: 18px; 
margin-left: 170px; 
font-size: 18px; 
font-weight:bolder; ¥ 

.banner2 a:link { 
color: #000000; 
text-decoration: none: 

} 

.banner2 a:visited { 
text-decoration: none: 
color:#FFF; 

) 

.banner2 a:hover { 
text-decoration: underhne: 
color: #FF9900; 

} 

.banner2 a:active { 
text-decoration: none; 
color: #000000: 

) 

/*mid 部 分 

#zhuce{ width:239px: 

height:187px: 
background-image:url(mages/ndex 03.g1f);} 

.username{ width:150px: 

height: 1 Spx; 
margin-left:Spx; 
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margin-top:38px; 
color:#e716f9・ 


.Dassword1 width:150px: 
height: 1 Spx; 
margin-left:Spx; 
margin-top:8pxX; 
color:#e7f6f9;} 
#news{ width:453px: 
height:187px: 
background-image:url(/1mages/index 04.jpg):! 
.news{ width:385px: 
height:97px: 
margin-left:49px: 
margin-top:44px; 
line-height:20px;} 


投票 系统 的 脐 态 负面 效果 即 页 面 布局 已 经 完成 ， 本 实例 中 痛 页 的 布局 和 其 他 二 级 页面 的 
结构 基本 一 样 ， 二 级 负面 的 布局 样式 单独 写成 了 CSS 文件 夹 中 的 style2.css 文件 ， 读 者 可 以 
打开 光盘 中 的 相应 文件 浏览 参考 使 用 。 


投票 系统 规划 


本 广 将 介绍 使 用 Access 建立 数据 库 和 数据 表 的 方法 ， 同 时 介绍 投票 系统 数据 库 的 连接 
方法 ， 投 票 系统 的 数据 库 主要 用 来 存储 投票 选项 和 投 佘 次 数 。 


也 系统 页 面 规划 


对 投票 系统 来 说 可 以 分 为 3 个 部 分 ， 一 个 是 计算 投票 页 面 ， 一 个 是 显示 投票 结果 页 面 ， 
另外 一 个 是 用 来 提供 选择 投票 选项 的 页 面 。 投 票 系统 总 共有 3 个 页 面 分 别 为 开始 投票 页 面 、 
计算 投票 页 面 和 投票 成 功 显 示 投 票 结 采 页 和 面 。 系 统 页 面 的 功能 与 文件 名 如 下 。 

Dw index.asp: 投票 系统 网 站 的 首页 。 

較 vote.asp: 开始 进行 投票 的 页 面 。 

Du voteadd.asp: 计算 投票 效果 并 增加 记录 的 页 面 。 
Du voteok.asp: 图 形 化 显示 投票 结果 的 页 面 。 


了 数据 库 设 计 


投票 系统 需要 一 个 用 来 存储 投票 选项 和 投票 次 数 的 数据 表 vote。 投 票 信息 数据 表 vote 的 
字段 结构 采用 表 6-1 所 示 的 结构 。 数 据 库 设计 的 步 又 如 下 : 


2 


中 


表 6-1 投票 信息 数据 表 vote 


在 Microsoft Access 2007 中 实现 数据 库 的 搭建 ， 首 先 运 行 Microsoft Access 


状 认 值 
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2007 程序 。 单 击 “ 空 白 数据 库 ” 按 钮 忆 .， 在 主 界 面 的 右 侧 打开 “空白 数据 库 ” 面 板 ， 如 图 


6-13 所 示 。 


[i 
ED Microesoft Office Access 
Emr ュ 
Ed 上 EE も コ 
转 色 联 横 蜂 硬 
| 
| 
| 室 自 点 把 库 
TE rt 
| 变 和 件 名 曾 ] 
は 1 トド | 加 
Ei Deemanis vir を mtiisEi bel [ha em fi 5 
。 。 i Le | | 取 而 
画 三 nn | 
本 | 下 而 


图 6-13 打开 的 空白 数据 库 面 板 


单 击 “ 空 白 数据 库 ” 面板 中 的 “浏览 到 某 个 位 置 来 存放 数据 库 ” 按钮 名 
开 “ 文 件 新 建 数据 库 ” 对 话 框 ， 在 “保存 位 置 ” 后 面 的 下 拉 列 表 中 选择 站 点 chap06 文件 


中 的 mdb 文件 夹 中 ， 在 “文件 名 ”文本 框 中 输入 文件 名 vote， 如 图 6-14 所 示 。 


保存 位 置 て ): 
办 我 最 ii 的 文档 
BE 
图 我 的 文档 

4 我 的 电脑 
\ 同上 人 居 


a nab 


文件 名 四): - |vote.m 


保存 类 型 て ) : | 1croso 


图 6-14 设置 “文件 新 建 数据 库 ” 对 话 框 


， 打 


単 市 “ 砂 定 ” 接 哲 , 返 回 “空白 数 据 麻 ” 面板 , 再 単 訓 “空白 数 指 麻 ” 面板 中 
的 “创建 ”按钮 ， 即 在 Microsoft Access 2007 中 创建 了 votemdb 数据 库 ， 同 时 Microsoft 
Access 2007 目 动 生 成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 用 鼠标 右键 单 击 选 择 “ 表 1: 表 ” 数 据 


表 ， 打 开 快捷 菜单 ， 执 行 快捷 菜单 中 的 “设计 视图 ”命令 ， 如 图 6-15 所 示 。 
CO に oe ーー っ vote : 本 昌 雇 TAcreis 2002 - 2004 宰相 本 本 ) 。 MicTnsG RE ーー 
ke | 国 lg 5 a 8 = に 

| Ra 二 ao ド レコ ヨコ 
| sm tl Ee E | 
| ms ET ね WP 
FT In  - 語 上 箇 上 百 革 点 
柯 日 上 [eg 
| | 町 用 
細 二 寺 太 本 } | 
SR 
ET i 
名 村 限于 旧作 和 二 本 民 卫 要 曾 :1| 
| | 
开 归 坦 吊 绊 汪 [HI 
到 二 LI) 
衣着 殺 上 
a Wi 
-Eg 
ーー EE TE TY EE ] 


图 6-15 打开 的 快捷 亲 单 命令 


执行 快捷 菜单 中 的 “设计 视图 ”命令 ,打开 
“另存 为 ”对 话 框 ， 在 “ 表 名 称 ” 文 本 框 中 输入 数据 表 名 称 
vote, a 6-16 所 示 。 

单 击 “ 确 定 ” 按 钮 ， 即 在 “所 有 表 ” 列 表 框 中 
建立 了 vote 数据 表 ， 接 下 来 按 表 6-1 输入 字段 名 并 设置 其  ，。，。，， 
属性 ， 完 成 后 如 图 6-17 所 示 。 图 6-16 设置 “ 表 名 称 ” 为 vote 


[uu » 


字段 恒 性 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 


F1 键 可 查看 有 关 字 段 名 称 的 示 助 。 


6-17 创建 vote 数据 表 的 字段 
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双 市 “ote: 泰 ， 打 开 vote 的 数据 表 ， 为 了 预览 方便 ， 可 以 在 数据 库 中 预先 添 
加 一 些 投票 内 容 所 为 数据 ， 如 图 6-18 所 示 。 


表 工 具 
外 部 数据 数据 库 械 具 数 握 表 


中 文 简 繁 转换 


x 


itenm 
国 vote: 表 由 户外 虎 烧 
2 漂流 话 动 
3 自助 打 浇 
4 室内 游泳 
米 (新建 ) 
记录 : 4 《第 1 项 共 4 项 ，Mr | 到 


图 6-18 vote 数据 表 中 的 输入 数据 
编辑 完成 ， 单 击 “ 保 存 ” 按 钮 回 ， 完 成 数据 库 的 创建 ， 最 后 关闭 Access 2007 软件 。 


江間 创建 数据 库 连接 


数据 库 创建 完成 后 ， 必 须 在 Dreamweaver CSS 中 建立 能 够 使 用 的 数据 源 连接 对 象 ， 这 样 
才能 在 动态 网 页 中 使 用 这 个 数据 库 文 件 。 接 下 来 将 介绍 在 Dreamweaver CSS 中 用 ODBC 连 
接 数 据 库 的 方法 ， 有 具体 的 连接 步骤 如 下 : 

执行 “控制 面板 ”一 “省 理工 具 ” 一 “数据 源 ODBC)” 一 “系统 DSN” 命 
今 , 打开 “ODBC 数据 源 管理 闫 ”对 话 框 中 的 “系统 DSN” 选 项 卡 ， 如 图 6-19 所 示 。 

在 “系统 DSN” 対策 権 中 単 市 “添加 (D)” 接 外 , 打 井 “ 倒 建 新 数 据 源 ” 
对 话 框 ， 在 打开 的 “创建 新 数据 源 ” 对 话 杠 中， 选择“Driver do Microsoft Access 
(*.mdb)” 选 项 。 

选择 “Driver do Microsoft Access〈(*.mdb)” 选 项 后 单 击 “ 完 成 ”按钮 。 打 开 
“ODBC Microsoft Access 安 装 ” 対策 椎 , 在 “数 据 源 名 (N)” 文 本 框 中 输入 vote， 如 图 6-20 
所 示 。 

を 10DBC 数 据 江 管理 回 


用 户 DSW 系统 DSH | 文件 DSW | 驱动 程序 | 跟踪 ”| 连接 池 | 关 于 | 
系统 数据 源 (8): 


ODBC 了 icrosoft Access 安装 


数 据 源 名 ): ”| 加 本 
说 明 中): | 
数据 库 
数据 库 :了 D:\chap0B\mdb\wote. mdb 帮助 (KH) | 
选择 (8)... | 创建 C).… | 收复 (EE)... | 压缩 如 )... | Rs 


取消 


系统 数据 库 


* 无 还) 
个 数据 库 (1): 


Ei 选项 0) >> | 


图 6-20 ODBC Microsoft Access 设置 


【在线 投 


第 6 章 票 系统 


然后 单 击 “ 选 择 〈S$)” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 框 ， 单 击 “ 张 动 需 
(V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 站 ， 从 下 拉 菜 单 中 找到 创建 数据 库 步 又 中 保存 数据 库 的 文 
件 ， 然 后 再 在 左上 方 “ 数 据 库 名 “A)” 文 本 框 的 下 方 选择 数据 库 文 件 vote.mdb， 则 数据 库 名 
称 自动 添加 到 “数据 库 名 “(A)” 文本 框 中 ， 如 图 6-21 所 示 。 

找到 数据 库 后 ， 在 “选择 数据 库 ” 对 话 框 中 单 击 “ 确 定 ” 按 钮 ， 回 到 “ODBC 
Microsoft Access 安装 ”对 话 框 中 ， 再 次 单 击 “ 人 确定 ”按钮 ， 则 返回 到 “ODBC 数据 源 管 理 器 ” 
中 的 “系统 DSN” 选 项 卡 ， 则 可 以 看 到 “系统 数据 源 ” 中 已 丝 添加 了 一 个 名 称 为 vote 的 系统 
DNS， 张 动 程 序 为 “Driver do Microsoft Access (*.mdb)” 的 系统 数据 源 ， 如 图 6-22 所 示 。 

eoDpc 数据 源 管理 器 


用 户 DSH 系统 DSW | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 (8): 


目录 I): 配置 (C).…. 
d: tchanHE mdb 


ODEC 系统 数据 源 存 娃 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
| ” 统 数 据 源 对 当前 机 器 上 的 所 有 用 户 可 见 ， 包 插 WT 服务 。 


立 件 从 型 了): 


图 6-21 选择 数据 库 文件 图 6-22 ODBC 数据 源 管理 器 
再 次 单 击 “ 确 定 ” 按 钮 ， 完 成 “ODBC 数据 源 管 理 器 ”中 “系统 DSN” 的 


设置 。 

局 动 Dreamweaver CSS， 设 置 好 “站 点 和“ 文档 ーーー 
类 型 ”和 “测试 服务 器 ”， 在 网 站 根 目 录 下 打开 index.asp 网 页 。 
执行 菜单 栏 中 的 “文件 ”一 “窗口 ”一 “数据 库 ” 命 令 ， 打 开 ”图 6-23 执行 “数据 源 名 称 
“数据 库 ” 面 板 ， 单 击 “ 数 据 库 ”面板 中 的 加 号 “+” 投 钮 ， 打 CDSN) ”命令 
开 下 拉 末 单 ， 在 下 拉 列 表 中 选择 “数据 源 名 称 (DSN)” 命 令 ， 如 图 6-23 所 示 。 

打开 “数据 源 名 称 (DSN)” 对 话 杠 ， 在 “连接 名 称 : ”文本 框 中 输入 connvote， 
单 击 “数据 源 名 称 (DSN): ”文本 框 右 侧 的 下 拉 三 角 按 钮 半 ， 从 打开 的 下 拉 沫 单 中 选择 在 
“数据 源 〈ODBC)” 一 “系统 DSN” 中 所 添加 的 vote， 其 他 保持 款 认 信 ， 如 图 6-24 所 示 。 


数据 源 名 称 (D5N) 


连接 名 称 : cornnmnvote 
数据 源 名 称 (DS: v 
用 戸 名 : 


密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSN 
② 使 用 本 地 DSN 


图 6-24 数 据 源 名 称 (DSN) 
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单 击 “确定 ” 投 钮 ， 完 成 数据 库 的 连接 ， 同 时 在 网 站 根 目 孙 下 目 动 创建 一 个 名 
为 Connections 的 文件 来 , Connections 文件 夹 中 有 一 个 名 为 connvote.asp 的 文件 , 
connvote.asp 文件 可 以 用 记事 本 打开 ， 如 图 6-2 所 示 。 


外 connvote 一 記事 本 同 回 四 
文件 ) 编辑 应) 格式 Q) 查看 外) 和 帮助 0) 

K% 

' FileName="Connection _ odbc _ conn_dsn.htm" 
' Type="ADO" 

hated hate i "ADO" 

' HTTP="'fals 

i a 

”Schema=”” 

Dim Hl connuvote STRING 

HM_connvote STRING = "dsn=vote;" 

る > 


6-25 用 记事 本 打开 connvote.asp 
人 至此， 数据 库 的 连接 操作 已 完成 。 


投票 系统 幢 面 设计 


对 投票 系统 来 说 主要 设计 的 页 面 是 投票 页 面 vote.asp 和 显示 结果 页 面 voteok.asp， 其 中 
陵 时 数据 库 中 的 数据 上 自动 增加 的 代码 是 在 voteadd.asp 页 面 中 实现 的 。 


人 < 投票 王 页 面 


制作 投票 页 面 vote.asp， 这 个 页 面 主 要 用 于 显示 投票 的 主题 和 投票 的 内 容 ， 让 网 站 浏览 
者 进行 投票 。 

具体 的 制作 步骤 如 下 : 

创建 vote.asp 页 面 在 文档 中 的 布局 效果 ， 即 页 面 的 静态 部 分 效果 如 图 6-26 所 示 。 


veap06Vwote ss (PL)* -Dx 
| CRD omote ep swe css | 


と Sot pp | て MK ( | bd 


< | 
Ioedy> Givi dy VIDOR om vtR 7995v 9 F712 WK Gari" | 


6-26 插入 页 面 的 静态 部 分 效果 


各 系统 


执行 菜单 栏 中 的 “ 捅 入 ”一 “表单 ”一 “表单 ”命令 插入 一 个 表单 ， 再 执行 沫 
单 伴 “插入 ”一 “表单 ”一 “ 单 选 按 钮 ”命令 插入 一 个 单 选 近 钮 ， 选 中 单 选 按钮 并 在 “ 属 
性 ”面板 中 将 其 命名 为 “ID ”， 如 图 6-27 所 示 。 


の 


局 性 
口 | ee 定価 | | 。。 初 状 态 〇 已 选 台 类 回 | 元 加 | 
nm | 中 思 区 


图 6-27 设置 单 选 按钮 名 称 


在 第 一 行 中 输入 资 明 文字 “您 最 喜欢 的 度 ee ， 和 再 次 执行 荣 单 栏 中 的 
“插入 ”一 “表单 ”一 “按钮 ”命令 ， 插 入 两 个 按钮 ， 一 个 是 用 来 提交 表单 的 按 包 ， 人 彼 命 名 
为 “投票 ”，” 男 外 一 个 是 用 来 合 看 投票 结 末 的 按钮 ， 侯 命 本 “ 合 看 ”， 设 莉 及 效 来 如 图 6-28 
所 示 。 


生計 


按钮 名 称 值 吧 ) 动作 上) 提 变 表单 外 ) 站 无 加 美 C) 
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按钮 名 和 代 ) 医者 。)。 | 。 动作 总 扣 克 表 单 &) 〇 无 人 ) 类 | 现 局 
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图 6-28 设置 及 效果 图 
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开始 制作 动态 部 分 。 单 击 “ 绑 定 ” 面 板 中 的 “+” 号 按钮 ， 在 弹出 的 来 单 中 ， 
选择 “记录 集 (查询 )” 选 项 ， en “记录 集 ” 设 置 对话 框 ， 按 如 下 参数 进行 设置 ， 单 南 
“确定 ” 投 钮 完成 设 定 ， 如 图 6-29 所 示 。 2 
@ 在 “名 称 ” 文 本 框 中 输入 Rs 作为 该 记 
录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 connvote 
数据 源 连 接 对 象 。 
@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 
数据 库 表 对 象 为 vote。 
@ 在 “ 列 ” 选 项 栏 中 选择 “全 部 ” 单 选 
按钮 。 
@ 设置 “人 沛 选 ” 的 条 件 为 “无 ”。 
@ 设置 “排序 ”的 条 件 为 “无 ” 图 6-29 设 定 Rs 记录 集 
绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 什 vote.asp 网 页 的 适当 位 置 ， 如 图 6-30 
所 示 。 


Tn: い chap0e vote. asp (KHTML)* EEC 


世上 已 和 connvote. asp style2.css 


< 山 > 
人 body> <divimnid> <div#tiao> <form#forml > <p> [wl|9 100% ~v|685 x 261v 92 K /2 秒 | 简体 中 六 (GB2312) 


图 6-30 ”记录 集 的 字段 插入 全 vote.asp 网 页 


单 击 选择 单 选 按钮 ， 将 字段 DD 插入 到 里 面 去 ， 插 入 后 以 在 单 选 按 钮 的 属性 面 
板 中 的 “ 逃 定信 ” 文 本 権 中 就 添加 了 搬 入 卫 字段 的 相应 代码 为 <%=(Rs.Fields. 
Item("ID").Value)%> 如 图 6-31 所 示 。 
RE er 


5) 单 选 按钮 选 定 值 <%= CRs. Fields. It | 初始 状态 〇 ① 巳 名 逃 (C) 美 C) 无 マ 
| m | [区 动态. 昌 未 渤 中 四 $ 


图 6-31 插入 字段 ID 到 单 选 按 钮 


由 于 vote.asp 页 面 将 显示 投票 选项 的 所 有 记录 ， 而 目前 的 设 定 则 只 能 显示 数据 
库 的 第 一 笔 数 据 ， 因 此 ， 需 要 加 入 “服务 喜 行 为 ”中 的 “重复 区 域 ” 命 令 ， 单 击 vote.asp 页 
面 中 的 行 ， 如 图 6-32 所 示 。 


Bn: \chapoe\vote. asp (KHTML)* = 


NEA connvote. asp style2.css 


> 
body> <divimid> <div¥tiao? <form#forml >[<p) [RJA 685 x 261v 92 /2 秘 简体 中 如 (6B2312)  : 


图 6-32 ”选择 要 重复 的 行 


再 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 喜 行 为 ”面板 ， 并 在 面板 中 单 击 “ 增 
加 服务 器 行为 ”中 的 “+” 按 钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ” 先 项， 打开“ 重复 区 
域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 “所 有 记录 ” 单 选 按钮 ， 如 图 6-33 所 示 。 


WE = っ つつ ~ 
OE 
② 所 有 记录 


图 6-33 ”设置 “重复 区 域 ” 对 话 框 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 堪 上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 此 时 的 效果 如 图 6-34 所 示 。 
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图 6-34 重复 区 域 后 的 效 末 
在 vote.asp 页 面 中 ， 在 “标签 选择 器 ”中 单 击 <from> 标 签 ， 并 在 “属性 ”面板 
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中 设置 表单 “ffom1” 的 “动作 ”为 设置 投票 数据 增加 的 页 面 /voteaddasp 。“ 方 法 ”为 
POST， 如 图 6-35 所 示 。 


RE 
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6-35 ”设置 表单 动作 


选择 页 面 中 的 “ 答 看 ”按钮 ， 选 择 “ 标 签 <inpu 人 ”面板 ， 单 击 “ 行 为 ”面板 
中 的 加 号 “+” 投 钮 ， 在 弹出 的 列表 选项 中 选择 “ 转 到 URL ”命令 。 

在 打开 的 “ 转 到 URL” 对 话 框 中 ， 在 “URL” 文 本 框 中 输入 要 转 到 的 文件 
“voteok.asp” 如 图 6-36 所 示 。 


图 6-36 输入 转 到 URL 的 文件 地 址 
单 击 “ 确 定 ” 按 钮 ， 完 成 转 到 URL 的 设置 ， 此 时 的 “行为 ”面板 如 图 6-37 
所 示 。 


标签 惊 癌 器 
| 慣性 | 行为 | 标 竹 <input> 


| = a= | + Nw 
WE 


6-37 “行为 ”面板 


到 这 里 vote.asp 动态 网 页 已 经 设计 完成 。 


下 于 投票 数 累 计 页 面 | 


计算 投票 数 页 面 voteadd.asp， 主 要 方法 是 接收 vote.asp 所 传递 过 来 的 参数 ， 然 后 再 进行 


计算 ， 创 建 方法 如 下 : 
创建 动态 页 面 voteadd.asp， 单 击 局 铝 按钮 ， 然 后 输入 如 下 代码 : 


<!--#include file="Connections/connvote.asp" --> 

<% 

if(request("ID") <> "") then Commandl ID= request("ID") 

0%0> 

<% 

set Command1 = Server.CreateObject("ADODB.Command") 

Command1.ActiveConnection = MM connvote STRING 

Command1.CommandText = "UPDATE vote SET vote = vote + 1 WHERE item = "+ 
Replace(Command1 ID,"™™,"™™")+"" 

Command1.CommandType=1 


Command1.CommandTimeout = 0 

Command1.Prepared = true 

Command1.Execute() 

response.redrect( "voteok.asp") 

// 转 到 voteok.asp 页 面 

0%0> 

SQL 语法 说 明 : 

UPDATE vote 

/更 新 vote 数据 表 

SET vote = vote + 1 

/更 新 的 字段 为 “vote” 并 “vote” 在 原 有 基础 上 加 “1? 
WHERE item = ID' 

/更 新 条 件 的 字段 为 “itetm” 等 于 传 过 来 的 参数 “ID?” 


完成 的 voteadd.asp 页 面 的 制作 效果 如 图 6-38 所 示 。 
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6-38 完成 的 voteadd.asp 页 面 效果 


于 下 证 投票 结果 页 面 


最 后 要 制作 显示 投票 结果 页 面 voteok.asp， 这 个 页 面 主 要 用 于 显示 投票 总 数 和 各 投票 的 
比例 ， 静 态 页 面 的 设计 效果 如 图 6-39 所 示 。 
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る る 
<body> divinid> [|9 1100% 、|869 x 452v94K ア 2 秘 簡体 中 文 (GB2312) 


图 6-39 显示 结果 页 面 设计 


其 体制 作 步 又 如 下 : 

创建 voteok.asp 静态 页 面 ， 单 击 “ 绑 定 ” 面 板 中 的 “+” 号 按钮 ， 在 弹出 的 荣 
单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 
“确定 ”按钮 完成 设 定 ， 如 网 6-40 所 示 。 

@ 在 “名 称 ” 文 本 框 中 输入 Rs 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connvote 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 vote。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 设置 “ 沛 选 ” 的 条 件 为 “无 ”。 


2 
表格 


列 : 包 全 部 し 选 定 的 : 


i 


图 6-40” 设 定 Rs 记录 和 集 


@ 设置 “排序 ”的 条 件 为 “无 ”。 
再 次 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 
(得 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 单 击 “ 高 级 ”按钮 ， 进 入 局 级 编辑 窗口 ， 按 如 下 参 


【在 线 投票 系 


数 进行 设置 : 
@ 在 “名 称 ” 文 本 框 中 输入 Rsl 作为 该 记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 connvote 数据 源 连 接 对 象 。 
@ 在 SQL 文本 框 中 输入 


SELECT sum(vote) as sum 
/选择 vote 字段 进行 计算 合计 ， 函 数 “sum()” 用 于 计算 总 值 
FROM vote 


// 从 数据 表 “vote” 中 取出 数据 
其 他 参数 保持 默认 值 ， 如 图 6-41 所 示 。 


: jconnvote 


: SELECT sum (vote] as sum 
FROM vote 


参数 : +| 


数据 库 项 : 表 格 添加 到 | SQL: 
9 還 
半 ”预存 过 程 RR 


URIER BY 


图 6-41 设 定 Rsl 记录 集 


单 击 “确定 ”按钮 ， 完 成 记录 集 的 设置 ， 绑 定 记录 集 后 ， 将 记录 集中 的 字段 插 
入 至 voteok.asp 网 页 的 适当 位 置 ， 如 图 6-42 所 示 。 


違 | n:tchap0Etroteok.asp (KHTML)* 


NEW connvote. asp style2.css 


っ an in) hi 投 昌 EN STE TES ! 
投票 结果 如 下 
Rs. item} : 一 占 {Rs. vote} % 票数 : {Rs. vote} 


< 
<body><div 和 nid> 


图 6-42 ”字段 的 绑 定 


単 市 回 人 按钮 ， 进 入 “代码 ”视图 编辑 页 面 ， 在 “代码 ”视图 编辑 页 面 中 找 
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到 如 下 代码 : 


<%=(Rs.Fields.Item("vote"). Value)%>/<%=(Rsl.Fields.Item("sum"). Value)%> 
/相应 百分比 的 代码 。 


按 下 面 步 又 修改 此 段 代 码 : 
@ 去 挥 “/” 前 面 的 “%>” 和 “/” 后 面 的 <%= 得 到 代码 : 
<%=(Rs.Fields.Item("vote"). Value) / (Rsl.Fields.Item( "sum").Value)%> 


@ 把 “<%=” 和 “9%>” 之 间 的 代码 用 《〈) 把 它 给 括 上 ， 得 到 代码 : 
<%=( (Rs.Fields.Item("vote").Value) / (Rs1.Fields.Item("sum").Value) )%> 

@ 在 代码 后 面 加 入 *100， 再 次 全 部 用 〈) 给 括 上 ， 得 到 代码 : 
<%=( ( (Rs.Fields.Item("vote").Value) / (Rs1.Fields.Item("sum").Value) )*100)%> 


@ 在 代码 前 面 加 入 round， 在 *100 前 面 加 入 小 数 点 保留 位 数 4, 井 用 () 括 上 , 得 到 
代码 : 
<%=(Round(((Rs.Fields.Item("vote").Value)/(Rsl.Fields.Item("sum").Value)),4)*100)%> 
因为 控制 网 页 中 的 长 度 也 用 到 这 段 代 码 ， 所 以 将 这 段 代码 进行 复制 ， 然 后 单 击 
选择 图 案 ， 切 换 到 “代码 ”窗口 ， 选 择 <img> 中 的 width 的 值 将 复制 的 代码 进行 粘贴 ， 因 
为 在 图 案 中 没有 用 到 小 数 点 的 设置 ， 所 以 将 代码 前 面 的 round 和 保留 位 数 4 删除 ， 得 到 的 代 
人 码 如 下 : 
<img src="images/bar.gif" width="<%=(((Rs.Fields.Item("vote"). Value)/ 
(Rsl.Fields.Item("sum"). Value))*100)%>%" height="13" /> 
这 样 图 像 就 可 以 根据 比例 的 大 小 进行 党 度 的 缩放 ， 设 置 如 图 6-43 所 示 。 
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TE n: い chap0Etroteok.asp (KHTML)* 


ERLE® connvote.asp style2. css 
网 


div 1d= logo > く 1mg src= /1mageS1/1ridex2 Ul. ]pg 


Bb <div id="bammer"> 
廊 <div class="barmer1"> 
<a href="#"> 首 页 |</a><a href="#"> 且 点 地 图 |<7a><a href="#"》 留 言 咨 询 《 a div> 
i <div class="barmer2"> 
《7 《<a href="#"> 首 页 </ay/ 《a href="#"》 景 点 推荐 </a》/<a href="#"> 团 队 活动 <7a>y<a href="*#"> 再 线 投票 <7a 
闪 >/<a href="#"> 娱 乐 项 目 <7a>y<a href="#" > 交通 路 线 《/a> 《div> 
く /diy> 


< div> 

<div id= “mid “> 

<div id="zhuce" ><img src="/imagesl/index2 03. jpe” /Ydiv> 

<div id="tiao" 

<p> 足 共有 く %= (Rs1.Fields.Item(“sum"). Yalue)%> く /spar> 人 参加 鬼 票 : </p> 
<form id="forml” name="forml” method="post” action=""> 

中 时 《p> 投票 结果 和 如下: </p> 
“5 日 に ーー (Rs. ii Ttem("1tem ) 。 es <img src="1 ‘bar. gif” width="<%=(( (Rs. Fields. Ttem( 
rote ). Yalue)/ (Rsl.Fields. Item(” sum ). Valuej ) *11 ight=" 13"/> 占 《<%= (Round (( (Rs. Fields. Itent 
rote"). Yalue) 7 (Rs 1.Fields. Itemt” sum っ 'Y alue)), 4) > 

款 数 : <W%= sr Fields. Itemt” vote ). alue)%> く /p> 
<input name=" Submit” type="reset” 本 MU goToURL( parert'。 vote. asp ) ;return 
document. NMOL_returnValue" value=" 返 回 “ = 


<body> <divimid> <divttiao> <form#forml > <p> 95 下 /2 秒 简体 中 你 (6B2312) 


图 6-43 ”设置 图 标的 缩放 


单 击 通 旨 按钮 ， 回 到 “设计 ”编辑 窗口 ， 由 于 voteok.asp 页 面 显示 投票 选项 
的 所 有 比例 ， 而 目前 的 设 定 只 能 显示 数据 库 的 第 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ” 


E 站 ; 污 玉 在 线 投票 系统 


中 的 “重复 区 域 ” 命 令 ， 单 击 voteok.asp 页 面 中 需要 重复 的 行 ， 如 网 6-44 所 示 。 


ED: \chap0E voteok. asp (XHTML)* - 口 X 
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图 6-44 选择 重复 的 行 
单 击 “ 应 用 程序 ”和 面板 群 组 中 的 “服务 器 行为 ”面板 中 的 “+” 号 按钮 ， 在 弹 
出 的 菜单 列表 中 选择 “重复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 单 击 选 择 “ 所 有 记录 ” 
单 选 按钮 ， 如 图 6-45 所 示 。 


图 6-45 ”设置 重复 区 域 为 所 有 记录 


单 击 “ 确 定 ” 欣 钮 回 到 编辑 负面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 的 左上 角 出 
现 了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完 成 设 定 。 

选择 页 面 中 的 “返回 ”按钮 ， 选 择 “标签 <inpu 人 ”面板 ， 单 击 “ 行 为 ”面板 
中 的 加 号 “+” 投 钮 ， 在 弹出 的 列表 选项 中 选择 “ 转 到 URL”， 在 打开 的 “ 转 到 URL” 対策 
框 中 的 “URL” 文 本 框 中 输入 要 转 到 的 文件 vote.asp， 设 置 如 网 6-46 所 示 。 


打开 在 : 下 


: vote. asp | [浏览 …. | [浏览 ... | 


图 6-46 转 到 URL 的 设置 


最 后 单 击 “ 确 定 ” 按 钮 ， 完 成 显示 结果 页 面 voteok.asp 的 设置 ， 效 果 如 图 6-47 


所 示 。 
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6-47 ”投票 结果 的 效 坟 
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论坛 系统 可 以 说 是 功能 强化 后 的 留言 板 系 


统 ， 每 个 网 站 的 用 户 都 可 以 在 论坛 发 布 信息 或 
提出 看 法 。 本 章 我 们 主要 以 制作 一 个 市 论坛 系 
统 的 文化 艺术 交流 网 站 为 实例 ， 回 该 者 介绍 论 
坛 系统 的 开发 方法 。 


aa 
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本 章 的 实例 效果 
J 到 盘 i 


教学 重点 


拾 建 论坛 系统 开发 平台 に 
论坛 系统 规划 の 

论坛 主页 面 に 

新 增 主题 、 删 除 主 题 、 回 复 主 题 的 方法 に 
后 台 管 理 に 
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有 拱 建 论坛 系统 开发 平台 


论坛 系统 通过 在 计算 机 上 运行 服务 软件 ， 允 许 用 户 使 用 终端 程序 通过 mtemet 与 其 进行 
连接 ， 执 行 下 载 数据 或 程序 、 上 传 数据 、 阅 读 讨论 主题 、 与 其 他 用 户 交 换 消息 等 功能 。 开 发 
该 系统 同样 需要 在 木 地 计算 机 上 搭建 开发 平台 。 


衝 月 月 使用 Photoshop CS5 分 割 图 片 


下 面 束 开始 用 Photoshop CSS 切片 工具 分 割 首页 图 片 。 

首先 在 本 地 计算 机 的 D 盘 中 建立 站 点 文件 夹 chap07， 在 站 点 文件 夹 里 面 建立 
一 些 常用 文件 夹 。 然 后 从 光盘 中 找到 站 点 chap07/psd 文件 夹 下 的 index.psd 文件 ， 将 其 复制 
到 本 地 站 点 psd 文件 夹 中 。 

启动 Photoshop CS5。 选 择 菜单 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开 首 页 
index.psd 文件 ， 可 分 割 的 效 末 如 图 7-1 所 示 。 
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正二 三宮 下 


7-1 设计 的 首页 可 分 割 效果 


开始 分 割 各 部 分 图 片 ， 首 先 分 割 最 上 面 的 Logo 所 在 行 的 图 片 ， 单 击 工具 箱 中 
的 “切片 工具 ”按钮 | 各， 按 住 鼠 标 左 键 从 场景 的 左上 拖 忠 到 标题 的 右 下 角 ， 如 图 7-2 所 
示 ， 图 中 虚线 框 绘 制 的 区 域 就 是 切片 大 小 ， 切 片 后 左上 角 将 显示 一 个 国 国 图 标 。 


环 询 文 化 艺术 


ES ED ER 


7-2 Logo 部 分 的 切片 效果 


按 下 《CarH》 组 合 键 ， 打 开 辅 助 线 视 匈 ， 可 以 先 用 辅助 线 分 制 好 需要 分 割 的 
区 域 ， 再 按照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 15 个 小 图 片 ， 如 图 7-3 所 示 。 
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图 7-3 ”分割 整个 首页 的 效果 


选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “ 折 散 ” 模式 , 
“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 7-4 所 示 。 
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LL 飞 双 联 、 本 殿 
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图 7-4 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “ 储 存 ” 按 钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 选择 “保存 在 ” 
后 面 的 下 拉 三 角 按钮 后， 选择 建立 的 chap07 文件 夹 ， 其 他 保持 默认 值 ， 设 置 如 图 7- 所 示 。 
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将 优化 结果 存储 为 


保存 在 这) : 


= 
我 最 近 的 文档 《 回 ) 
已 


桌面 


立件 名 他 ) : 
保存 美 型 I): 
设置 : 

切片 : 


7-5 


GE) 单 击 “保存 ”按钮 ， 


index. html 保存 G) 


HTML 和 图 像 t.htm1) 


默认 设置 


所 有 切片 


“将 优化 结果 存储 为 ”对 话 框 设 置 
完成 保存 切记 的 操作 。 打 开 保存 文件 的 路 径 ， 可 以 看 到 目 


动 生成 了 一 个 名 为 images 的 文件 来 ， 文 件 夹 里 古 前 面 分 割 后 产生 的 小 图 片 ， 由 这 些小 图 片 
组 成 了 首页 的 效 末 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 7-6 所 示 。 
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配置 的 步骤 如 下 : 
首先 启动 IIS, 在 IIS 窗口 中 ， 用 鼠标 右键 单 击 “ 默 认 网 站 ”选择 菜单 中 的 
“属性 ”命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 7-7 所 示 。 


= 賠 博 时 性 ? x ©) 


网 站 | IS 上 FI 乱 洗 器 | 主 目录 | 交 档 | 目录 安全 性 | HTTF 头 | 自 定 必 错误 
网 站 标识 
IF 地 址 立 ): 性 部 未 分 配 ) v 
TCF 端 口 Tj: 60 。 | 
连接 
连接 超时 他 ) | 
国保 持 HTTF 连接 后) 


区 ] 局 用 日 志 记 录 ) 
活动 日 志 格 陈 記 ): 


|W3r 扩展 日 志文 件 格式 | 


图 7-7 “默认 网 站 属性 ”对 话 框 


单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 站 点 文件 夹 路 径 为 
“D:chap07”， 其 他 保持 默认 值 ， 设 置 如 网 7-8 所 示 。 


点 从 网 站 尾 性 


网 站 “| ISAPI 第 选 器 | 主 目录 | 文档 “| 目录 实 全 性 | Tr 共 | 自 定 愉 错 误 
连接 到 资源 时 的 内 容 来 源 : 
⑤ 此 计算 机 上 的 目录 mi) 
〇 另 一 台 计 算 村 上 的 共享 名 ) 
站 重 定 向 到 URL 


本 地 路 径 丰 ): In:tchannT | 
品 脚 本 资源 访问 并 1 记录 访问 仿 ) 

读 职 站) 索引 资源 让) 

口 写 入 i) 

[| 目录 浏览 旺 ) 

应 用 程序 语 置 


应 用 程序 名 出 1 默认 应 用 程序 | [删除 区) | 删除 量 ) “| 


开 娟 位 置 : ED 


配置 他 .， | 
抗 行 根 限 中): 釧 脚 計 


应 用 程序 保护 是 ]): 中 (共用 ) wv | 


图 7-8 设置 网 站 的 “本 地 路 径 ” 


单 击 “ 确 定 ” 按 钮 ， 完 成 “默认 网 站 属性 ”的 配置 ， 由 于 前 和 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 正 浏览 器 输入 地 
址 http://127.0.0.1， 即 可 打开 页 和 面 分 割 后 的 效果 。 


108 证 创建 编辑 站 点 chap07 
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使用 Dreamweaver CS5 进行 网 页 布局 设计 ， 首 先 需 要 用 定义 站 点 问 导 定义 站 点 ， 操 作 步 


骤 如 下 : 


打开 Dreamweaver CS5， 选 择 菜单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 


“管理 站 点 ”对 话 框 。 
ELEZ2) 单 击 右边 的 “新 建 ” 按 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ” 命 
“站 点 设置 对 象 ”对 话 框 ， 进 行 如 下 参数 设置 : 
“站 点 名 称 ” chap07。 
“本 地 站 点 文件 夹 ” Di:chap07\。 
如 图 7-9 所 示 。 


站 点 设置 对 甸 chap07 


Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweaver 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文 件 的 计算 机 上 的 本 地 文件 
夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 到 web 上 的 服务 器 上 的 远程 文件 夹 。 


您 可 以 在 此 处 汰 Dreamweaver 站 点 选择 本 地 立 件 来 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 来 ; = 


图 7-9 设置 站 点 对 话 框 


早 击 “分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 
“服务 器 名 称 ”: chap07。 

“连接 方法 ”， 本 地 /网 络 。 

“服务 器 文件 夹 ”，D:chap07。 

“Web URL”: http:/127.0.0.1。 


单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 在 Dreamweaver CS 中 就 已 经 拥有 


了 刚才 押 设 置 的 站 点 。 


对 整体 的 页 面 布局 规划 设计 ， 如 图 7-10 所 示 。 
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图 7-10 整体 布局 设计 


使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 ASP 文档 格式 ， 
将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>// 宣 告 为 ASP 文档 

<IDOCTYPE html PUBLIC "“-/W3C/DID XHTML 1.0 Transitional/EN" "http://www.w3. 
org/ TR/xhtmll/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http:/www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet" href="css/style.css" type="text/css"/> 

<title> 文 化 艺术 </title> 

</head> 
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其 他 div 的 布局 代码 如 下 : 


<body> 
<div id="top "> 
<div id="logo"><img src デ "1mages/index 01.jpg" /></div> 
<div 1d="banner"> 
<div class="banner1 "> 
<a hre 伍 #"> 首 ”页 </a> | <a hre 伍 "#"> 注 ” 册 </a> | <a hre 伍 "#"> 登 、 录 </a> | <a hre 伍 "#"> 收 藏 
本 站 </a> | <a hre 伍 "#"> 网 站 地 图 </a></div> 
<div class="banner2"> 
<a href="#"> 首 页 </a>|<a hre 伍 "#"> 和 党 甘 天 地 </a>|<a href="# が > 文化 超 市 </a>|<a hre 伍 "#"> 时 
尚文 化 </a>|<a hre 住 "#"> 文 化 产业 </a>|<a hre 伍 "#"> 文 化 博览 </a>|<a hre 伍 "#"> 文 化 论坛 </a></div> 
</div> 
</div> 
<div 1d="mid"> 
<div id="tiao"><img src="/1mages/index 03.jpg"></div> 
<div id="tul "><img src デ "71mages/index 04.jpg"></div> 
<div id="pinpai"><img src="/1mages/index 05.jpg"></div> 
<div id="neil "> 
<div class="nei1 "> <a hre 人 f="#"> 刚 刚 进入 21 世纪 ， 文 化 产业 便 在 世界 范围 内 呈现 出 
焊 发 式 的 发 展 态势 ， 并 已 经 成 为 世界 发 达 国 家 和 地 区 新 型 经 济 的 增长 极 。 文 化 与 技术 紧密 结合 ， 打 造 
出 文化 产业 这 一 “朝阳 产业 ”的 诱 人 前 景 。 </a></div> 
</div> 


<div id="wel"><img src="/images/index 07.jpg"></div> 


<div id="zixun "><img src="/images/index 08.jpg"></div> 
<div id="nei2"> 
<div class="nei2"> 
<a hre 伍 "#">“ 相 约 北京 ”文化 活动 于 不胜 收 
2008-06-11</a> <a hre 伍 "#"> 文 艺 作 品 彩 显 中 华 民 族 伟 大 精神 
2008-07-11</a> <a hre 伍 "#">《 热 血 五 月 2008》 学 术 座谈 会 
2008-07-05</a></div> 
</div> 
<div 1id="tu2"><img src="/images/index 10.jpg"></div> 


<div id="minfeng"> 


<div class="minfeng"> <a hre 人 ="#"> 婚 并 习俗 是 社会 风俗 的 重要 组 成 部 分 ， 也 是 村 
沙文 化 的 重要 内 容 ， 它 最 能 形象 地 反映 区 域 社会 与 族群 文化 的 特质 .. 

</a></div> 

</div> 


<div id="nei3 "><img src="/images/index 12.jpg"></div> 
<div id="tui"><img src="/1mages/index 13.jpg"></div> 
<div 1d= "us"><lmg src="/i1mages/index 14.]pg"></div> 

</div> 

<div id="bottom"> 

<div id="copyright"><img src="/1mages/index 15.gif"></div> 

</div> 

</body> 

</html> 
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div 布局 完成 后 需要 将 该 负面 你 存 ， 选 择 亲 单 栏 中 的 “文件 ”一 “为 存 为 ” 命 
令 ， 打 开 “ 万 存 为 ”对 话 框 ， 在 “文件 名 ”文本 框 中 输入 文件 名 为 “index.asp”“， 单 击 选 择 
“保存 类 型 ”后 面 的 下 拉 三 角 按 钮 关 ， 在 打开 的 快捷 菜单 中 选择 Active Server Pages (*.asp: _ 
*.asa) 菜单 项 ， 如 图 7-11 所 示 。 单 击 “ 保 存 ” 按 钮 完成 首页 的 布局 设计 。 ©) 


保存 在 红 ): し コ chap0T 


psd 
© 


桌面 


5 


岡上 部 居 


文件 名 男 ) : index. asp 保存 (8) 


保存 美 型 代 〕: hctive Server Pages (*. asp;*. asa) | 取消 


图 7-11 “另存 为 ”对 话 框 设 置 
在 站 点 中 建立 css 文件 来， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


な 页 面 整体 CSS*/ 
*{ margin:Opx; 


padding:Opx:! 
body{ width:100%; height: 100%; font-size:12px: background:#FC6:) 
上 # 设 置 页 面 链 接 光 
a:link { 
color: #000000: 
text-decoration: none: 
) 
a:visited 1 
text-decoration: none; 
color:#673914: 
} 
a:hover { 
text-decoration: underline; 
color: #F F9900; 
} 
a:active { 
text-decoration: none: 
color: #000000; 
} 
な 设置 所 有 图 片 的 边框 为 0*/ 
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Img { 

border: 0:) 
な 设置 最 外 层 大 中 显示 ， 实 现 让 整个 页 面 大 中 显示 */ 
#top,#mid,#bottom{ margin:auto; width:99Spx;} 
/* 设置 左 浮动 的 标签 */ 
#logo,#banner,#tul,#pinpai,#neil, 


#wel,#zixun,#ne12,#tu2,#minfeng, 
#ne13,#tui,#us{ float:left;} 
/*top 部 分 */ 

#banner{ width:644px: 

height:126px: 
background-image:url(/7nmages/index 02.jpg):) 

.bannerl 1 width:270px: 

height: 1 Spx; 
margin-left:3 10px; 
margin-top:SSpx;} 

.banner21 width:580px; 

height:23px: 
margin-left:49px: 
margin-tOD:27DX: 
font-size: ] 8px; 
font-weight:bold; 

.banner2 a:link { 
color: #000000: 
text-decoration: none: 

} 

.banner2 a:visited { 
text-decoration: none: 
color:#FFF:; 

} 

.banner2 a:hover { 
text-decoration: underhne: 
color: #FF9900: 

} 

.banner2 a:active { 
text-decoration: none: 
color: #000000; 

} 

/*mid 部 分 */ 

#mid{ background-color:#FFF:) 

#nell { width:417px; 

height:75px; 
background-image:url(/1mages/index 06.jpg):) 

.nell 1 width:340px: 

height:60px: 
margin-left:SOpx; 
margin-top: 7px; 


line-height: 1 Spx;} 
#ne121 width:417px; 
height:90px: 
backeround-image:url(/1images/mndex 09.jpg):) 
.ne121 width:345px: 
height:60px: 
margin-left:42px; 
margin-top:3px; 
line-height:20px;} 
#minfeng{ width:171px: 
height:159px: 
background-image:url(/images/index 11.jpg):! 
.minfeng{ width:133px: 
height:80px: 
margin-left:33px; 
margin-top:39px; 
line-height: 1 Spx;} 
.Show{ width:880px; 
margin-left:SOpx; 
margin-top:30px; 
margin-bottom:30px; 
line-height: 1 Spx;} 


将 首页 中 间 部 分 删除 ， 存 为 moban.asp 作为 二 级 页 面 ， 如 图 7-12 所 示 。 
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7-12 ”制作 的 三 级 页 面 效 末 


_ Section_ 


叶 下 ”论坛 系统 规划 


本 市 将 介绍 论坛 系统 的 整体 规划 与 数据 库 设 计 。 论 坛 系统 的 页 面 要 实现 的 功能 主要 包括 
狐 增 讨论 主题 、 回 复 讨论 主题 、 修 改 讨 论 主题 、 删 除 讨论 主题 、 删 除 回复 内 容 以 及 关键 词 搜 


论坛 系统 的 页 面 比 较 多 ， 在 制作 之 前 要 先 对 各 个 页 和 面 做 一 下 了 解 。 本 实例 开发 该 论 


本 骤 如 下 : 
在 正 浏 览 器 中 输入 本 系统 的 访问 地 址 ， 打开 本 系统 的 首页 如 图 7- 13 所 示 。 
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图 7-13 系统 的 首页 效果 


单 击 “ 文 化 论坛 ”文字 链接 可 以 打开 论坛 系统 的 主页 forum.asp， 如 图 7-14 所 
示 。 在 该 页 面 上 主要 显示 讨论 标题 、 发 言 者 的 表情 、 作 者 、 回 复 次 数 、 最 新 回复 的 时 间 、 阅 


读 的 次 数 以 及 标题 的 发 布 时 间 。 
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7-14 论坛 首页 效果 


【论坛 系统 


单 击 讨论 标题 即 可 以 进入 相应 的 讨论 页 面 detaiLasp， 如 图 7-15 所 示 。 
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可 古 Entarmm 
图 7-15 论坛 的 讨论 页 面 
单 击 detail.asp 负面 中 的 “回复 主题 ”文学 链接 ， 即 可 以 进入 回复 主题 页 面 
reforum.asp， 如 图 7-16 所 示 。 输 入 相应 的 信息 后 ， 单 击 “ 确 定 提 交 ” 按 钮 即 可 完成 主题 回 
复 的 功能 。 
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图 7-16 回复 主题 的 页 面 


单 击 论坛 系统 的 主页 forum.asp 中 的 “管理 ”文字 链接 即 可 以 进入 后 台 管 理 者 
登录 页 面 admin login.asp， 如 图 7-17 所 示 。 
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入 Internet 


图 7-17 后 台 管 理 登 录 页 面 


输入 用 户 名 和 密码 ， 单 击 “ 登 录 ” 按 钮 ， 即 可 以 登录 后 台 管理 的 主页 面 
admin.asp， 如 图 7-18 所 示 。 在 该 页 面 中 增加 了 “修改 ”和 “删除 ”的 功能 ， 管 理 者 可 以 单 
击 相 应 的 链接 进入 相关 的 主题 进行 管理 
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图 7-18 后 人 台 管 理 主页 面 


单 击 其 中 任意 一 个 标题 后 面 的 “修改 ”链接 ， 可 以 进入 讨论 标题 和 内 容 的 修改 
页 面 adtitle.asp， 如 图 7-19 所 示 。 修 改 相 关 的 内 容 后 单 击 “确定 修改 ”按钮 即 完成 修改 。 
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图 7-19 讨论 标题 修改 页 面 


单 击 管理 主页 面 admin.asp 中 的 任意 一 个 讨论 主题 后 面 的 “删除 ”文字 链接 ， 进 入 
删除 讨论 标题 页 面 deltitle.asp， 如 图 7-20 所 示 。 单 击 “ 确 定 删除 ” 即 完成 该 主题 的 删除 操作 。 
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图 7-20 删除 讨论 主题 页 面 
EM ヨ は 9】) 


沦 坛 系统 还 要 有 删除 回复 的 功能 ， 在 这 里 单 击 管理 的 主页 面 admn.asp 中 的 任 
本 NGI A 面 delrefasp, a 7-21 所 示 。 
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删除 回复 的 主页 面 
早 击 加 除 回复 页 面 delref.asp 中 的 “删除 回复 ”文字 链接 


确定 页 面 delrefcontent.asp， 如 图 7-22 所 示 。 单 击 “ 确 定 删 除 ” 按 钮 后 ， 
从 数据 库 中 删除 。 
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图 7-22 确定 删除 回复 的 页 面 


アオコ Dreannweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 
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建立 论坛 数据 库 


论坛 的 数据 库 开 发 主要 由 开发 系统 的 大 小 而 定 ， 本 实例 建立 一 个 forum 数据 库 ， 并 在 里 
面 建立 admins、bbsmain、bbsref 三 个 数据 表 ， 其 中 bbsmain 数据 表 用 于 存放 论坛 讨论 主题 的 
一 些 信息 数据 ，bbsref 数据 表 用 来 存放 回复 主题 的 一 些 信息 数据 ， 本 实例 的 难点 在 于 这 两 个 
数据 表 的 关联 使 用 。 

首先 使 用 Microsoft Access 2007 创建 forum 数据 库 ， 具 体制 作 步 又 如 下 : 

首先 运行 Microsoft Access 2007 程序 。 单 击 “ 空 白 数据 库 ” 按 钮 .号 .， 在 主 界 
面 的 側 打 井 “空白 数 据 麻 ” 面板 。 


开 “ 文 件 新 建 数据 库 ” 对 话 框 ， 在 “保存 位 置 ” 后 面 的 下 拉 列 表 中 选择 前 面 创建 站 点 chap07 
中 的 mdb 文件 夹 ， 在 “文件 名 ”文本 框 中 输入 文件 名 forum。 单 击 “ 确 定 ” 投 钮 ， 返 回 “ 至 
日 数据 库 ” 和 面板。 

単 証 “空白 数 据 麻 ” 面板 中 的 “ 倒 建 抜 視 ”, 即 在 Microsoft Access 2007 中 创 
建 了 forum.mdb 文件 , 同時 MicrosoftAccess 2007 目 动 生成 了 一 个 名 为 “ 表 1: 表 ” 数 据 表 。 

建立 数 据 麻 forum 之 后 ，forum 数据 库 中 的 数据 表 需 要 创建 后 台 管 理 表 
admin、 讨 论 主题 数据 表 bbsmain 以 及 回复 主题 数据 表 bbsref。 设 计数 据 库 中 后 全 管理 数据 表 
admin 的 字段 结构 采用 表 7-1 所 示 的 结构 。 


表 7-1 管理 者 信息 表 admin 


意 义 字段 名 称 数据 类 型 字段 大 小 | 必 填 字段 | 允许 空 字符 串 驮 认 值 


按 表 7-1 创建 的 admin 数据 表 如 图 7-23 所 示 。 


PF 
中 


bbwiwt 


| 
GRE, F6 = MF, FE = 杏里 [3 


图 7-23 创建 admin 表 的 字段 
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设计 数据 库 中 发 表 主题 的 数据 表 bbsmain 的 字段 结构 采用 表 7-2 所 示 的 结构 。 
这 个 数据 表 用 于 储存 讨论 主题 的 相关 内 容 ， 其 中 bbsID 字段 作为 主 索 3 引 栏 。 


表 7-2 主题 数据 表 bbsmain 


意 义 | 字段 名 称 允许 空 字符 串 | 默 认 值 
发 布 痢 邮 条 


按 表 7-2 创建 的 bbsmain 数据 表 如 图 7-24 所 示 。 
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图 7-24 bbsmain 数据 表 


设计 数据 库 中 回复 主题 数据 表 bbsref 的 字段 结构 采用 表 7-3 所 示 的 结构 。 这 个 
数据 表 用 于 储存 回复 讨论 的 相关 内 容 ， 其 中 以 bbsrefID 子 段 作为 主 索 引 栏 。 


表 7-3 主题 数据 表 bbsref 


HR | i | Hm | Kaw | | 
gm | wa | | | | 
Of | wwemm | 人 | | * | ぁ wu 
WW | waeewn | xt | mg | ぁ a | su 


按 表 7-3 创建 的 bbsref 数据 表 如 图 7-23 所 示 。 
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= ー bbsrefriume a 
bbsmain; 囊 hhsi + 1 me 目 期 /时间 
habr に bbsrefeontent 音 了 
| kro :要 bbesrefsesr 次 本 


bbsrefiarl 家事 
bbsrefnall 補 率 


に ni 


李 隆 吕 放 最 长 可 到 64 个 可行 | 卜 下 至 全 |。 計 
F1 笛 可 下 看 有 关 李 限 扣 隐 的 本 双 ， 


FE 軍 妹 


OL 


识 计 入 加 了 = 如 深圳 阳 ，。 Fl = 咽 困 。 il LS 


图 7-25 bbsref 数据 表 


创建 数据 库 连 接 


数据 库 编辑 完成 后 ， 必 须 在 Dreamweaver CSS 中 建立 能 够 使 用 的 数据 源 连 接 对 象 。 这 样 
才能 在 动态 网 页 中 使 用 这 个 数据 库 文 件 。 操 作 的 过 程 中 应 特别 注意 ODBC 连接 时 参数 的 设 


置 。 有 具体 连接 步骤 如 下 : 


在 “控制 面板 ”中 ， 选 择 “ 管 理工 具 ” 打 开 管 理工 具 窗口 ， 双 击 运行 “ 数 
据 源 (ODBC)” 的 快捷 方式 咒 ” ， 将 打开 如 图 7-26 所 示 的 “ODBC 数据 源 管理 器 ”对 


话 框 。 
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对 认 值 


=Now() 


第 7 音 | 论坛 系统 


单 击 “ODBC 数据 源 管理 器 ”对 话 框 中 的 “系统 DSN” 选 项 卡 ， 如 图 7-27 
所 示 。 


を ToDBc 数据 源 管 理 器 を 10DBC 数据 源 管 理 器 
用 户 DSH | 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 用 户 DSW 系统 DSH | 文件 DSW| 3E 动 程序 | 跟踪 | 连接 池 | 关于 | 


用 户 数 据 源 UW): 系统 数据 源 (8): 
添加 Q⑪).… | 驱动 程序 添加 ⑪).… | 


Microsoft AAccess dEASE Driver 必 . EAT Driver do Microsoft Access (*.mdb) 


Excel Files Microsoft Excel Driver [(*.xls, *.x ] | dsrrews Driver do Microsoft Access (*.mdb】) ) | 
MS Accass atabase Microsoft Access Driver (*.mdb, * 間際 間際 


配置 (C).… 配置 (C)... | 


ODEC 系统 数据 源 存 诗 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
銃 数 手 着 対 当 前 机 器 上 的 所 有用 呆 可 見, 包括 WT 服务 。 


图 7-26 ODBC 数据 源 管理 器 中 的 用 户 DSN 图 7-27 ODBC 数据 源 管 理 需 中 的 系统 DSN 


在 “系统 DSN” 对 话 框 中 单 击 “ 添 加 (D)” 投 钮 ， 打 开 “ 创 建新 数据 源 ” 对 
话 框 ， 如 图 7-28 所 示 。 

在 “创建 数据 源 ” 对 话 框 中， 选择 “Driver do Microsoft Access (*.mdb)” 选 
项 ， 然 后 单 击 “ 完 成 ”按钮 。 打 开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 源 名 
CN)” 文 本 框 中 输入 forum， 如 图 7-29 所 示 。 


选择 您 想 尝 其 实 装 数据 源 的 驱动 程序 G)。 re 
ODBC Hicrosoft ACCESS 安装 


Driver da Microsoft para arquivos texto (ボボ. 数据 源 名 人) : [forun| 

Driver do Microsoft Access [*.mdb) 

Driver do Microsoft dBase [*. dbf) 说 明 句 ) : 

Driver do Microsoft Excel (*.xl1s) 

Driver do Microsoft Paradox (*. db ) 数据 库 

Driver para 0 Microsoft Visual FoxFro 

Microsoft Access Driver (*.mdb) ーー 

Microsoft Access-Treiber (*.mdb) 选择 [8)... | 创建 (CY)... | 修复 (R)... | 压缩 仙 )... | ーー 
Microsoft dBase lriyer (*. dbf) 高 级 Q).… . | 
Microsoft dBase VFF Driver (*. dbE] 

LE mm bbe ~ * 有 アデ ェ トト ~ 系统 数据 库 


で 元 ) 
个 数据 库 他) : 


用 が 选项 0) >> | 


图 7-28 倒 建 数 据 源 图 7-29 ODBC Microsoft Access 安装 


单 击 “选择 (S)” 按 钮 ， 打 开 “ 选 择 数 据 库 ” 对 话 框 ， 如 图 7-30 所 示 。 単 市 
“驱动 器 (V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 了， 从 下 拉 菜 单 中 找到 在 创建 数据 库 步 骤 中 数据 库 
所 在 的 盘 符 ， 在 “目录 (D) :” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 
左上 方 “数据 库 名 〈A)” 选 项 组 中 的 数据 库 文 件 forum.mdb， 则 数据 库 名 称 目 动 添加 到 “ 数 
据 库 名 “A)” 下 方 的 文本 框 中 。 

找到 数据 库 后 ， 在 “选择 数据 库 ” 对 话 框 中 单 击 “确定 ”按钮 ， 回 到 
“ODBC Microsoft Access 安装 ”对 话 框 中 ， 再 次 单 击 “确定 ”按钮 ， 将 返回 到 “ODBC 数 
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据 源 管理 右 ” 中 的 “系统 DSN” 对 话 框 中 ， 则 可 以 看 到 “系统 数据 源 〈S)” 中 已 经 添加 了 
一 个 名 称 为 “forum”， 驶 动 程序 为 “Driver do Microsoft Access (*.mdb)” 的 系统 数据 源 ， 
如 图 7-31 所 示 。 


を 10DBC 数据 源 管理 器 
用 户 nsN 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 区 ): 


添加 年).. . 
人 Driver do Microsoft Access (*.mdb) 
Driver do Microsoft Access (*.mdb) ] | 
Driver do Microsoft Access (x.mdb) 間際 


ーー Driver do Microsoft Access (*.mdb) 
目录 Da: ote Driver do Microsoft Access (*.mdb) 配置 (C). | 


d: chanHT mdb 


[Sd 
[SS charHT 


0DBC 系统 数据 源 存 诸 了 如 
统 数 据 源 对 当 前 条 器 上 的 所 


世人 忻 当 型 (I) : 


|Access 数据 库 fm 下 | | 国 4: 新吉 巻 "| 


图 7-30 ”选择 forum.mdb 数据 库 图 7-31 ODBC 数据 源 管理 器 


再 次 单 击 “ 确 定 ” 按 钮 ， 完 成 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 


司 动 Dreamweaver CS5， 设置 好 “站 点 ”“ 文 档 类 型 ”和 “测试 服务 器 ”， 在 
Dreamweaver CS5 软件 中 打开 剖面 布局 的 index.asp 页 面 ， 执 行 菜单 栏 中 的 “文件 ”一 “ 窗 
口 ” 一 “数据 库 ” 命 令 ， 打 开 “ 数 据 库 ”面板 。 

单 击 “数据 库 ” 面 板 中 的 “+” 号 按钮 ， 单 击 选择 “数据 源 名 称 (DSN)” 

打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 : ”文本 框 中 输入 dsnforum, 

単 訓 “数 据 源 名 称 (DSN): ”文本 框 右 侧 的 三 角 按 钮 兰 ， 从 打开 的 下 拉 菜 单 中 选择 在 “数据 源 
(ODBC)” 一 “系统 DSN” 中 所 添加 的 forum， 其 他 保持 默认 值 ， 如 图 7-32 所 示 。 

在 “数据 源 名 称 (DSN)” 页 面 中 ， 单 击 “ 测 试 ”按钮 ， 如 果 打开 图 7-33 所 示 页 
面 ， 则 说 明 数 据 库 连接 成 功 ， 否 则 应 逐一 检验 之 前 各 项 步骤 是 否 正 确 完成 ， 修 改 至 测试 成 功 。 


数据 源 名 称 (DSH) 


到 


合 令 


连接 名 称 : dsnforunm| 


数据 源 名 称 (DSW): | forun Wm | Dreamweaver [x| 
用 户 名 : ーー 


密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSW 
>) 使 用 本 地 DSH 


图 7-32 ”数据 源 名 称 (DSN) 图 7-33 ”成功 创建 连接 脚本 
单 击 “ 确 定 ” 按 钮 ， 完 成 数据 库 的 连接 。 


| Section_ 


和 到 论坛 主页 面 及 其 查询 功能 


在 Dreamweaver CSS 中 定义 站 点 ， 在 数据 库 之 间 建 立 连 接 后 ， 就 可 以 进入 ASP 动态 网 
页 页 面 的 设计 阶段 。 


8 论坛 主页 面 
制作 讨论 主题 系统 的 主页 面 forum.asp， 这 个 页 0 题 的 标题 ， 使 


用 者 可 以 选择 要 阅读 的 标题 链接 至 详细 内 容 页 面 ， 以 及 管理 者 进入 管理 页 面 的 链接 。 系 统 主 
页 面 的 静态 部 分 美工 设计 如 图 7-34 所 示 。 


FD: \chapaT\ forum forum. asp CXHTML)* = 口 X 
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图 7-34 系统 主页 面 


这 个 网 页 的 主要 目的 是 要 显示 所 有 的 讨论 主题 、 每 个 主题 的 浏览 次 数 、 回 复数 与 最 新 回 
复 时 间 及 发 布 时 间 ， 详 细 制 作 步骤 如 下 ; 
在 “ 绑 定 ”面板 中 单 击 加 号 “十 ” 按钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 
(查询 )” 选 项 。 
打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 如 图 7-35 所 示 。 
在 “名 称 ” 文 本 框 中 输入 rsBB 作为 该 记录 集 的 名 称 。 
从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 
从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 
在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 
设置 “筛选 ”的 条 件 为 “无 ” 
设置 “排序 ”的 条 件 为 “无 ”。 


・ [rsEE 
: | dsnforum 


: |bbsmalm 


の 全部 选 定 的 : 
直正 


图 7-35 設定 rsBB 记录 集 
单 击 “ 高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 的 页 面 ， 将 现 有 的 SQL 语句 改 成 以 下 
的 SQL 语句 ， 如 图 7-36 所 示 。 

01. SELECT 

02. bbsmam.bbsID, 

03. FIRST (bbsmain.bbstime) AS bbstime, FIRST (bbsmain.bbshits) AS bbshits, 

04 . FIRST (bbsmain.bbstitle) AS bbstitle,FIRST (bbsmam.bbsurl) AS bbsurl, FIRST 
(bbsmain.bbsemail) AS bbsemailFIRST (bbsmam.bbssex) AS bbssex, FIRST (bbsmam.bbsface) AS 
bbsface, FIRST (bbsmain.bbscontent) AS bbscontent, 

05. FIRST (bbsman.bbsname) AS bbsname,COUNT(bbsret.bbsmainlD) AS ReturnNum, 

06. MAX(bbsreft.bbstime) AS LatesTime 

07. FROM 

08. bbsmain LEFT OUTER JOIN bbsref ON 

09. bbsmain.bbsID=bbsref.bbsmainlD 

10. GROUP BY bbsmam.bbsID 


名 称 : 
连接: dsnforum wv 


SQL: SELECT bbsmain. bbsIl, 
smain. bbshits) AS 


FIRST (bb 
bbstitle, 
(bbsmain. bbsemail) MS TRST AS bbssex, 

FIRST (bbsmain. bbsface , TFTRST (bbsmain. bbscontent) AS 本 


参数 : +| 


HH 国 表格 
视图 


十 
可 关 ”预存 过 程 


图 7-36 改写 SQL 语句 


EA 论坛 系统 


说 明 : 

第 一 条 bbsref 数据 表 中 的 记录 都 可 以 通过 bbsmainID 字段 关联 到 bbsmain 数据 表 中 的 
bbsID 字段 。 就 是 说 bbsref 数据 表 中 对 应 的 数据 表 可 能 不 存在 ，bbsmain 数据 表 并 非 一 定 有 
对 应 回复 的 话题 。 因 此 以 LEFT JOIN 将 接合 关系 中 的 两 个 数据 表 分 成 左右 两 个 数据 表 ， 其 
中 左边 数据 表 在 经 过 接合 后 ， 不 管 右边 数据 表 是 否 存 在 数据 与 之 对 应 ,仍然 会 将 数据 全 部 列 
出 。 简 单 的 说 ， 就 是 不 管 讨论 主题 bbsmain 是 否 有 任何 的 回复 bbsref， 使 用 LEFT JOIN 可 以 
将 数据 表 bbsmain 中 的 所 有 讨论 主题 都 显示 出 来 。 

另外 GROUP BY 语句 是 针对 bbsMain 数据 表 中 的 bbsID 字段 ， 在 第 2 行 到 第 6 行 之 间 
的 意思 就 是 说 取出 bbsmian 数据 表 中 的 第 一 条 数据 的 特定 字段 内 容 。 同 时 将 bbsref 中 的 关联 
取出 ， 获 得 bbstime 和 bbsID 的 两 个 字段 内 容 。bbstime 字段 则 取 所 有 记录 当中 时 间 最 新 的 那 
一 条 。 而 bbsid 字段 则 用 COUNT 计算 有 多 少 人 回复 的 总 数 。 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 全 forum.asp 网 页 的 适当 位 置 ， 如 图 7-37 
所 示 。 
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图 7-37 字段 的 插入 


加 入 “如 果 记 录 集 不 为 空 则 显示 区 域 ”功能 。 首 先 选 中 记录 集 有 数据 时 要 显示 
的 数据 表格 ， 如 图 7-38 所 示 。 


Te 


表情 流言 主题 首 者 浊 香 漫 新 回复 NE:S 浅 布 时 间 
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图 7-38 ”选择 要 显示 的 表格 


单 击 “应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 ， 并 在 面板 中 单 击 加 号 “+” 
按钮 ， 在 弹出 的 菜单 列表 中 ， 选 择 “ 显 示 区 域 ”~ “如 果 记 录 集 不 为 空 则 显示 区 域 ” 选 
项 。 


打开 “如 果 记 录 集 不 为 空 则 显示 区 域 ”对 话 框 ， 保 持 默认 值 ， 单 击 “ 确 定 ” 按 
钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 显示 的 区 域 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显 


示 ...” 的 灰色 卷 标 ， 这 表示 已 经 完成 设置 ， 如 图 7-39 所 示 。 
如 果 记 对 集 科 为 空 则 显示 区 城 
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图 7-39 ”完成 设置 后 的 效 采 
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将 “目前 没有 发 表 任何 主题 ”区 域 设 定 成 “如 果 数 据 集 为 空 则 显示 区 域 ” 如 


图 7-40 所 示 。 
如 果 记 录 集 为 空 则 显示 区 城 
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图 7-40 ”如 果 数 据 集 为 空 则 显示 区 域 设 置 
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由 于 要 在 forum.asp 这 个 页 面 显示 数据 库 中 的 所 有 记录 ， 而 目前 的 设 定 只 能 显 
示 数 据 库 的 第 一 条 数据 ， 因 此 需要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 功 能 。 单 击 
rmasp 页 面 中 要 重复 的 单元 格 ， 如 图 741 所 示 、 


i rsBE. bbstitle} raps. bbsname} tr Rm) {rsBB. LatesTime} ifrsBB. bbshits} :{rsBB. bbstime} : © 
記事 信人 さ 諸 本 価 則 見 : : 


7-41 选择 要 重复 的 单元 格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“十 ” 投 钮 。 在 弹出 的 某 单 中 ， 选 择 “重复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 单 击 “ 确 
定 ” 按 钮 回 到 编辑 页 面 ， 发 现 先 前 所 选取 要 重复 的 区 域 左 上 角 出 现 了 一 个 “重复 ”的 灰色 标 
签 ， 这 表示 已 经 完成 议定 了 了， 如 图 7-42 所 示 。 


ED: \chapoT\forun\forum. asp (XHTML)* ー 回 に 


QR dsnforum.asp style.css Fp 
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A 人 人 全 
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7-42 设置 “重复 区 域 ” 


把 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 揪 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 条 ”按钮 受 |. 

打开 “记录 集 导 航 条 ”对 话 框 ， 单 击 选择 “记录 集 ” 后 面 的 下 拉 三 角 按钮 ， 在 
展开 的 菜单 中 选择 rsBB 记录 集 ， 然 后 再 单 击 选择 “显示 方式 ”为 “文本 ” 单 选 按钮 ， 最 后 单 
击 “确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 页 面 中 自动 插入 记录 集 的 导航 条 ， 如 图 7-43 所 示 。 


中 ichap0TKEorumtforum.asp 〔YHTWL)* 


IA dsnforum. asp style.css 


环 请 文化 蔚 术 ， 


し = こと 。 de a し a a = 


{rsBB. bbstitle 
国 如 有 果 符 合 此 条 件 则 显示 ... 
: 目前 没有 发 表 任何 主题 


本 网 动态 .小 关于 我 个 堂 服务 ,| 设 为 首页 _| 志 情 链接 -| 作 水 招聘 
环 售 文化 艺术 本 网 动态 _| 关于 我 们 上 广告 服 务 _| 设 为 首页 | 志恒 链接 _| 人 才 招 聘 
る | 


て Hiy > く 員 マッ Te 


| 包 
<tr>Ktd】 [kG 100X  v|930x 4d97v 208 kK /5 秒 筒 体 中 文 (GB2312) 


图 7-43 ”添加 记录 和 集 导 航 条 


在 forum.asp 这 个 页 面 中 除了 显示 网 站 中 所 有 的 讨论 主题 外 ， 还 要 为 浏览 者 提 

供 单 击 标题 内 容 链接 至 详细 内 容 页 面 来 阅读 ， 因 此 需要 加 入 “ 转 到 详细 页 面 ”服务 器 行为 。 

首先 选中 {rsBB.bbsTitle} 字段 ， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 

“添加 服务 器 行为 ”加 号 “十 ”按钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ”的 选项 。 
打开 “ 转 到 详细 页 面 ”对 话 框 ， 按 图 7-44 所 示 进 行 设 置 。 


转 到 评 细 页 面 


链接 : | 所 选 范围 : “<%= (rsBB.Fis1ds.Tt, v | 
详细 信息 页 : /forum/ detail. asp | 
传递 URL 参数 : bbsID ， 设置 为 以 下 项 的 值 


ww 


图 7-44 设置 “ 转 到 详细 页 面 ” 对 话 框 


在 forum.asp 页 面 中 有 两 个 文字 连接 “发 表 话 题 ” 和 “管理 ” 必须 设 定 其 
“链接 ”网 页 ， 其 中 “发 表 话 题 ”链接 到 forum add.asp,“ 管 理 ” 链 接 至 admin login.asp， 设 
置 如 图 7-45 所 示 。 


统 


ーーー 図像 , 1K 宽 T2 | 源 广 件 (8) | /images/postnew. gifl a 蔡 换 ①) wv 类 @ 
0G| | 高 四 | 桥接 mR oo 4 回 


地 图 如 | ”| 委 直 边 距 00 ”| 。 目标 @) v| ”边框 @) る A 

lk| ロロ OM 水 平 边 距 冯 ) 原始 | ET マ 

EE 

2 図像 , 1K 宽 59 | 源 娘 件 (8) | .7imagesyEditor. gifl Gy 蔡 换 ①) wv 类 避 ) | 
DO | 高 20 | 链接 C)atnin_ login as 9 编 和 回 あー 

地 图 如 | ”| 委 直 边 距 外 | | 。 目标 @) v| ”边框 @) 时 从 个 人 

lk| ロロ OM 水 平 边 距 冯 ) 原始 | ET マ 


7-45 设置 链接 


设置 链接 之 后 ， 把 鼠标 插入 到 “表情 ”下 面 的 单元 格 里 执行 沫 单 栏 中 的 “ 插 
入 ”一 “图 像 对 象 ” 一 “图 像 占 位 符 ” 人 命令， 打开“ 网 像 占 位 符 ” 对 话 框 ， 设 置 高 度 和 宽度 
都 入 20 像素 ， 如 图 7-46 所 示 。 单 击 “ 确 定 ” 按 钮 插入 一 个 图 像 占 位 和 从。 


图 萤 占 世 行 


放 人 


颜色 [FL | 
に に と 38 | | 


7-46 插入 “图 像 占 位 符 ” 


插入 “图 像 占 位 符 ” 之 后 ， 选 中 峡 像 占 位 符 ， 单 击 “ 属 性 ”面板 中 的 “ 源 文 
件 ” 文 本 框 后 面 的 “浏览 文件 ”按钮 加 ， 打 开 “ 选 择 图 像 源 文 件 ” 对 话 框 ， 在 该 对 话 框 中 单 
击 选 择 “ 数 据 源 ” 单 选 按钮 ， 然 后 在 “ 域 ” 列 表 框 中 单 击 选择 “记录 集 (rsBB)” 中 的 
bbsface 字段 ， 如 图 7-47 所 示 。 


で | "| 目 录 
站 点 和 服务 器 


选择 文件 名 自 : 〇 ) 立 件 系统 
⑤ 数据 源 


bbsname 

ReturnNum 
LatesTime 

[第 一 个 记录 索引 ] 
[最 后 一 个 记录 索引 ] 
[总 记录 数 ] 


格式 : 无 


URL: | 人 = (rsBE. Fields. Item("bbsface”). Value)%> 


在 站 点 定 尺 中 更 改 默 认 的 链接 相对 于 


7-47 选择 bbsface 字段 


单 击 “ 确 定 ” 投 钮 ， 完 成 “图 像 占 位 符 ” 的 数据 源 绑 定 操作 ， 此 时 页 面 效 果 如 
图 7-48 所 示 。 


ー の つ 
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ED: \chapoT\ forum forum. asp CXHTML) = 回 | が 


QH dsnforun.asp style.css < 
四 全 


开 二 六 化 艺术 


Se | aser AAA78 
A > Bs 
A A), 


A トチ た トト の 、 の うー で 
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TT | >| 


< - 
7-48 绑 定 “图 像 占 位 符 ” 的 数据 源 的 效果 


在 forum.asp 负面 中 加 入 查询 功能 也 是 必要 的 ， 在 论坛 使 用 较 长 一 段 时 间 后 ， 会 建立 很 
多 主题 ， 网 站 浏览 者 可 以 使 用 但 询 功 能 找到 
相应 的 讨论 主题 ， 然 后 方便 地 进行 回复 , 查 zm:| |[ 本 | 
询 主题 的 静态 设计 如 图 7-49 所 示 。 


得 询 切 能 的 人 制作 步 又 如 下 ; 7-49 ”查询 主题 设计 
单 击 选择 “但 询 主题 ”后 面 的 
文本 框 ， 在 “属性 ”面板 中 设置 “文本 域 ”名 为 keyword， 设 置 “ 衬 符 宽 度 ” 为 30， 蠕 击 选 


择 “ 关 型 ”为 “单行 ”的 单 选 按钮 ， 其 他 保持 默认 值 ， 如 图 7-50 所 示 。 
SEE pg 
国 文大 字 符 宮 度 ⑪ 50 | 类 型 @ 单 行 @6) 〇 多 行 。” 〇 密码 所 ) 
最 多 字符 数 | | 初始 值 CI | 19 
口 禁 用 ⑪) 
只 读 色 ) 
7-50 设置 “文本 框 ” 属 性 
将 之 前 建立 的 记录 集 rsBB 做 一 些 更 改 ， 双 击 rsBB 记录 集 打 开 “ 记 录 集 ”对 话 
框 ， 在 原 有 的 SQL 语法 中 ， 加 入 一 段 碍 询 功 能 的 语法 : 
WHERE bbsTitle hke '%"&keyword&"%o 


说 明 : 
其 中 like 是 模糊 查询 的 运算 子 ; % 表 示 任 意 字 符 : keyword 是 一 个 变量 ， 代 表 在 网 页 中 
输入 的 关键 词 。 


那么 以 前 的 SQL 语句 将 变 成 如 图 7-51 所 示 。 


论坛 系统 


: rsBE 


: | dsntorunm | 定 尺 ... 


: bbscontent, FIRST (bbsmain. bbsname) AS bbsname, COUNT へ 
(bbsref. bbsmairII] AS ReturnNum, MAX (bbsref. bbstime) AS LatesTime 一 
FROM bbsmain LEFT OUTER JOIN bbsref ON 

bbsmain. bbsID=bbsref. bbsmainIl 
OUP BY bbsmain. bbsID 


: 表格 添加 到 SQL: 
四 内 视图 [ swcr | 


半 预存 过 程 ーー 


URIER BY 


图 7-51 修改 SQL 语句 


切换 到 代码 窗口 ， 在 代码 第 6 行 中 加 入 请 求 变 量 代码 keyword=request 
("keyword")， 如 图 7-52 所 示 。 
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7-32 加 入 请 求 变 量 代 码 


以上 没 定 完成 后 , forum.asp 系统 主页 面 则 具有 查询 功能 ， 按 (F12) 筆 可 以 打 
开 至 浏览 需 测 试 得 询 功 能 设置 是 否 正 确 。 首 先 forum.asp 页 面 将 显示 所 有 网 站 中 的 讨论 主 
题 ， 如 图 7-53 所 示 。 
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图 7-53 主页 面 浏 览 效果 
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在 关键 词 中 和 输入 “亏本 ”并 单 击 “ 奉 询 ” 按 钮 ， 如 果 发 现 页 面 中 上 只 显示 市 
术 ” 关 键 子 的 主题 ， 则 说 明 查 询 功 能 设置 成 功 ， 僵 询 效 果 如 图 7-54 所 示 。 


号 文 做 艺术 Hicrosoftt Internet Expiorer 四 la 区 
文 六 加 病 橋 GE) 可 看 0 路 认 0) 工具 ① 帮 册 人 0 Fu 


Om の DAG の ee の ピ - あ に ・J 記 る 


きき | > I 00 Um tore wey hp rAd Hob LF 


了 环 计 文 化 艺术 


智慧 天 地 文化 超市 时 尚文 化 文化 产业 文化 博览 


7-54 测试 查询 效果 


| Section_ 


论坛 浏 帘 页 面 


Ea 


在 论坛 系统 中 ， 供 网 站 浏览 者 使 用 的 页 面 有 讨论 主题 评 细 内 容 页 面 detail.asp 和 回复 主 


题 页 面 reforum.asp， 本 廊 将 介绍 如 何 制作 这 两 个 动态 页 面 。 


7 讨论 主题 详细 内 容 页 面 


讨论 主题 详细 内 容 页 面 detail.asp 的 主要 功能 是 显示 主题 的 详细 内 容 ， 这 个 页 面 用 于 显 


示 讨 论 主题 的 详细 内 容 和 所 有 回复 者 的 回复 内 容 ， 其 版 面 设计 如 网 7-35 所 示 。 
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图 7-55 讨论 主题 详细 内 容 页 面 设计 


这 全 论坛 系统 


具体 制作 步骤 如 下 : 

在 detail.asp 由 和 面 中 要 同时 显示 讨论 主题 与 回复 主题 的 内 容 ， 因 此 需要 把 两 个 
数据 表 进行 合并 ， 一 次 取得 这 两 个 数据 表 中 的 所 有 字段， 并 且 根 据 主题 页 面 传送 过 来 的 URL ] 
参数 bbsID 进行 利 选 。 单 击 “ 绑 定 ” 面 板 ， 并 在 面板 中 单 击 加 号 “十 ”按钮 ， 在 弹出 的 菜 (3>) 
单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 。 站 和 

打开 “记录 集 ” 对 话 框 ， 单 击 “局 级 ”按钮 ， 进 入 记录 集 局 级 设 定 矶 面 ， 将 
現有 的 SQL 语句 改 成 以 下 的 SQL 语句 如 图 7-56 所 示 。 

01. SELECT bbsmain.*,bbsref.*FROM 

02. bbsmam LEFT OUTBR JOIN bbsref ON 

03. bbsmam.bbsID=bbsret.bbsmamlD 

04. WHERE 

05. bbsmam.bbsID = queryID 


名 称 : 
连接: dsnforum ~ 


SQL: SELECT bbsmain. *, bbsref.* 
FROM bbsmain LEFT OUTER JOIN bbsref ON 
bbsmain. bbsIlN=bbsref. bbsmainIl 
WHERE bbsmain. bbsID = quervyIl 


- 财 口 


百 表 格 添加 到 SaL: 


日 内 袖 加 
田 关 ”预存 过 程 ーー 


DRDER BY 


图 7-56 改写 SQL 语句 


上 图 中 设置 了 一 个 名 为 queryID 的 变量 值 ， 并 且 将 其 设 为 request.querystring(“bbsID”) 传 
递 过 来 的 参数 。 

SQL 语句 说 明 : 

同样 用 LEFT OUTER JOIN 关联 bbsmain 和 bbsref 中 的 字段 ， 取 得 两 个 数据 表 中 的 相关 
数据 。 并 且 用 WHERE 语句 ， 往 选 bbsmain 数据 表 中 的 bbsID 字段 值 等 于 传递 过 来 的 bbsID 
的 値 。 

设 定 完 上 面 记 录 集 绑 定 后 ， 接 下 来 把 记录 集 detail 中 的 字段 插入 到 页 面 中 ， 
两 个 图 像 占 位 符 分 别 绑 定 发 布 人 性 别 形象 bbssex 和 回复 人 性 别 形象 bbsrefsex， 其 结果 如 
TT 


ー ビデ 」 
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ED: chapoTh forumidetail. asp GHTML)* |X 


HA dsnforum. asp style. css 
に つ 1 EE i 一 i 1 
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: {dstai1.bbscontenti 
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~ 


河 龟 内容 : {detail. bbsrefcontent} 
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7-$7 detail 中 的 字段 插入 


单 击 选择 主题 表格 中 的 文字 “电子 邮件 ”， 然 后 单 击 “ 属 性 ”面板 中 的 “ 链 
接 ” 文 本 框 后 面 的 “浏览 文件 ”按钮 回 ， 打 开 “ 选 择 文件 ”对 话 框 ， 在 该 对 话 框 中 单 击 选择 
“数据 源 ” 单 选 按钮 ， 然 后 在 “ 域 ”列表 框 中 单 击 选择 “记录 集 (detail)” 中 的 bbsemail 字 
段 ， 并 且 在 URL 链接 前 面 加 上 mailto:， 设 置 如 图 7-58 所 示 。 


选取 文件 名 自 〇 文件 系统 站 点 和 服务 器 ... 
中 数 指 渡 


域 : | 日 多 ”记录 集 (detail) 

i bbsID 

: bbstitle 
bbscontent 
bbsname 
bbstime 
bbsface 
bbssex 


bbsurl 
bbshits 
bbsmalirD 


格式 : 无 
URL: mailto: <%= (detail. Fields. Item ("bbsemail"). Value)%> 
在 站 点 定 尺 中 更 改 默 认 的 链接 相对 于 


7-S8 ”设置 Email 的 链接 


单 击 选择 主题 表格 中 的 文字 “主页 ”， 单 击 “ 属 性 ”面板 中 的 “链接 ”文本 框 
后 面 的 “浏览 文件 ”按钮 回 ， 打 开 “ 选 择 文件 ”对 话 框 ， 在 该 对 话 框 中 单 击 选择 “数据 源 ” 
单 选 按钮 ， 然 后 在 “ 域 ” 列 表 框 中 单 击 选择 “记录 集 (detail)” 中 的 bbsurl 字段 ， 并 且 在 
URL 链接 前 面 加 上 http:/， 设 置 如 网 7-59 所 示 。 


选取 文件 名 自 O 〇 文件 系统 站 点 和 服务 器 
全 数 措 江 


bbsID 
bbstitle 


域 : | 日 隐 ”记录 集 (detail) 


bbscontent 
bbsname 
bbstime 
bbsface 
bbssex 
bbsemail 


bbshits 
bbsmainIl 


格式 : | 无 


URL: http <%= (detail. Fields. Item ("bbsurl"). Yalue)%> 
在 站 点 定义 中 更 改 默 认 的 链接 相对 于 


图 7-59 设置 URL 链接 
用 第 (4) 步 和 第 (5) 步 的 方法 ， 设 置 其 回复 人 的 “电子 邮件 ”和 “主页 ”的 
链接 。 得 到 效果 如 图 7-60 所 示 。 


Dp ens \ form\ dntatl ssp (XHTHL)S 
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7-60 绑 定 记录 集 Email 和 URL 


单 击 选择 文字 “回复 主题 ” 单 击 “ 服 务 器 行为 ”面板 中 的 “ 转 到 详细 页 面 ” 
功能 选项 ， 打 开 “ 转 到 详细 页 面 ”对 话 框 ， 按 图 7-61 所 示 进 行 设置 。 


链接 : “回复 主题 " 
详细 信息 页 : reforum. asp | 
传递 URL 参 数 : bbsTn 设置 为 以 下 项 的 值 
记录 集 : | detail v| 
A [mn = 
传递 现 有 参数 : | ] URL 参数 
[| 表单 参数 


7-61 设置 “ 转 到 详细 页 和 面 ” 对 话 杠 


时 时 っ i ミ ( { x i 。 ーー - 二 统 
有 = 和香 多 二 材 ] 出 可 | 四 - ‘ TE 到 系 Fj 


の 
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讨论 主题 中 的 回复 留言 可 能 不 只 一 条 ， 而 目前 的 设 定 则 只 能 显示 回复 主题 留言 
的 第 一 条 数据 ， 因 此 需要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 的 设置 ， 单 击 detail.asp 页 
面 中 要 重复 的 记录 列 ， 如 图 7-62 所 示 。 


河 复 内 容 : {detailbbsrefcontent} 


» 
» 


图 7-62 ”选择 要 重复 的 单元 格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 右 行 为 ”和 面板， 并 在 面板 中 单 击 加 号 
“十 ”按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 单 击 “ 确 
定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选取 要 重复 的 区 域 左 上 角 出 现 了 一 个 “重复 ”的 灰色 
标签 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 网 7-63 所 示 。 


モモ | Btchapnftfanmmtamtail mam LHF 


加里 
dT inte up ulyle em TI 


环 畜 文化 艺术 ,，- Tm 


讨 记 主题 lietail, bkstitlal : 记忆 类 本 四 


: [etail. biewnient 


图 aa 


斬 貼 鞭 :【Bwtii 世 志和 省 证 二 让 


* 
| 本 


a 
[中 


图 7-63 设置 “重复 区 域 ”对 话 框 及 效果 


加 入 “记录 集 导 航 条 ”功能 。 把 鼠标 移 至 要 加 入 “记录 和 集 导航 条 ”的 位 置 ， 单 
击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导 航 条 ”按钮 全 |。 

打开 “记录 集 导航 条 ”对 话 框 ， 单 击 选择 “记录 集 ” 后 面 的 下 拉 三 角 按钮 ， 在 展 
开 的 菜单 中 选择 detail 记录 集 ， 然 后 再 单 击 选择 “显示 方式 ”为 “文本 ” 单 选 按钮 ， 最 后 单 击 
“确定 ”按钮 回 到 编辑 页 面 ， 页 面 中 将 自动 插入 记录 集 导 航 条 ， 如 图 7-64 所 示 。 


记录 和 集 导航 条 


5: apr tl mrm CML = x 
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图 7-64 添加 记录 集 导航 条 


设置 后 击 次 妆 | 


在 论坛 讨论 主页 面 中 有 一 个 “阅读 ”的 统计 项 ， 当 浏览 者 单 击 标题 进入 得 看 内 容 时 ， 阅 


读 总 数 就 要 增加 一 次 。 其 功能 的 实现 方法 在 于 更 新 数据 表 bbsmain 里 的 bbshits 字段 。 详 细 操 
作 步 又 如 下 : 

打开 文件 detail.asp， 在 “应 用 程序 ”面板 中 的 “服务 器 行为 ”面板 中 选择 “ 命 
令 ” 选 项 。 打 开 “ 命 令 ” 对 话 框 ， 如 图 7-65 所 示 。 


一 CR) 
司 口 返 国 内 有 以 下 名 和 2i 孚 拓 ， 


图 7-65 打开 “命令 ”对 话 框 
在 打开 的 “命令 ”对 话 框 中 ， 设 置 “ 名 称 ” 为 cmdhits,“ 类 型 ”为 更 新 。SQL 


文本 域 中 输入 以 下 SQL 语句 。 
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01.UPDATE bbsmain 
02.SET bbshits = bbshits + 1 


03.WHERE bbsID = hitID 
单 击 选择 “命令 ”对 话 框 中 的 “变量 ”后 面 的 “增加 变量 ”加 号 “十 ”按钮 ， 
添加 hitID 变量， 设置 值 为 Request.QueryString("bbsID")， 设 置 如 图 7-66 所 示 。 


:lemdhits 连接 : | snforum 
: | 更 新 ~ 口 ] 返回 具有 以 下 名 称 的 记录 集 : 
: UFDATE bbsm 


SET tbshits = = bbshits † 1 
WHERE bbsID = hitID 


Request. QueryStrine ("bbsID") 


添加 到 SaL: 


类 ”预存 过 程 ーー 


7-66 设置 “命令 ”对 话 框 


说 明 : 
hitID 为 SQL 用 来 识别 回复 的 变量 。 其 值 等 于 当前 网 页 所 显示 的 主题 编号 。 


潮 增 讨论 主题 页 面 forum add.asp 主要 功能 是 将 页 面 的 表单 数据 新 增 到 站 点 的 数据 库 
中 ， 页 面 设计 如 图 7-67 所 示 。 


中 D: tchap0Ttforumtforum_add.asp CXHTML)* 


^ 
- 


< | | >| 
人 body><div 和 id><div show> [RJ GQ 100% v933 x 523v 213 K / 5 秒 简体 中 文 (GB2312) 


7-67 ”新 增 讨 论 页 面 效 末 图 


对 论坛 系统 


详细 操作 步骤 如 下 : 

在 图 7-67 中 加 入 了 一 个 隐藏 区 域 ， 设 置 “ 隐 藏 区域 ”名 称 为 bbshits， 并 设置 
“ 值 ”为 默认 值 1， 这 样 操作 是 为 了 实现 提交 增加 主题 时 ， 数 据 库 中 能 让 “阅读 ”的 次 数 设 置 。 
为 1 次， 隐藏 区 域 的 “属性 ”面板 设置 如 图 7-68 所 示 。 OO) 


隐 若 区 域 
IN bbshits 值 ) 1 多 


图 7-68 加入 bbshits 隐藏 区 域 


狐 讨 论 主题 的 表 蛙 提交 前 ， 要 为 这 个 表单 加 入 “检查 表单 ”的 动作 ， 这 样 能 保 
证 插入 到 数据 库 的 数据 都 是 有 实际 数据 的 ， 单 击 <forml> 标 签 ， 然 后 单 击 “ 服 务 器 行为 ” 面 
板 中 的 “十 ”号 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 检 验 表 单 ” 选 项 。 

打开 “ 检 和 碍 表单 ”对 话 框 ， 设 置 所 有 字段 “ 值 ” 为 “必需 的 >， 并 设置 相应 的 
“可 接受 ”范围 ， 有 具体 参数 如 图 7-69 所 示 。 


可 接受 〇 有 〇 “任何 东 西 C 〇 数字 
@@ ”电子 邮件 地 址 〇 数字 从 | 到 


图 7-69 设置 检查 表单 


单 击 “确定 ”按钮 完成 检 奋 表单 的 操作 。 上 只 有 加 入 “插入 记录 ”服务 器 行为 ， 
才能 将 新 的 讨论 主题 新 增 人 至 数据 表 bbsmain 中 。 执 行 荣 单 栏 中 的 “窗口 ”一 “服务 器 行为 ” 
命令 ， 打 开 “ 服 务 右 行为 ”面板 。 蛙 击 该 面板 中 的 “+” 写 按钮 ， 从 打开 的 采 单 中 选择 “ 插 
入 记录 ”命令 ， 同 该 网 页 搬入 记录 的 服务 带 行 为 。 

在 “插入 记录 ”对 话 框 中 ， 按 下 面 的 参数 进行 设置 ， 如 网 7-70 所 示 。 


连接 : マ 
插 太 到 表格 : bbsmain 图 
插入 后 ， 转 到 : |forum. asp 
获取 值 自 : 0T 
表单 元 来 :EE ns 
Se 种 公允 中 base 
ce 本 入 到 列 中 “も 


本 ) 
DSE "(区 本 ) 
et ee ( 立 本 ) 
bbsur1 插 六 到 列 中 ”bbsur1” ( 立 本 ) 


列 : bbstit1s 


图 7-70 设置 “搬入 记录 ”对 话 框 
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@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 连接 对 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 bbsmain 数据 表 。 

@ 在 “插入 后 ， 转 到 :” 栏 中 输入 forum.asp， 表 示 揪 入 成 功 后 返回 该 页 面 。 

@ 从 “获取 值 目 ”下 拉 有 玉音 中 选择 建立 的 forml 表单 对 象 。 

@ 在 “表单 元 素 ” 列 表 框 中 把 表单 中 的 字段 和 数据 库 中 的 学 段 一 一 对 应 。 

单 击 “确定 ”按钮 回 到 网 页 设计 编辑 页 面 ， 这 样 就 完成 了 插入 主题 页 面 
forum add.asp 的 设计 了 ， 完 成 后 的 效果 如 图 7-71 所 示 。 
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7-71 ”完成 插入 记录 的 效 来 


7 和 回复 讨论 主题 页 面 ] 


回复 讨论 主题 页 面 reforum.asp 的 设计 必定 相似 ， 主 要 功能 是 
将 页 面 的 表单 数据 新 增 到 网 站 的 bbsref 数据 表 中 。 它 的 版 面 设计 如 图 7-72 所 示 。 
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7-72 回复 讨论 主题 页 面 设计 


EA 论坛 系统 


创建 好 静态 页 面 后 ， 单 击 “ 绑 定 ”面板 中 的 “十 ”号 按钮 ， 在 弹出 的 菜单 中 ， 
选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 
定 ” 按 钮 完成 设 定 ， 如 图 7-73 所 示 。 


@ 在 “名 称 ”文本 框 中 输入 rsmain 作为 该 记录 集 的 名 称 。 O)) 
@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 由 
e 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 要 


e 在 “ 列 ”选项 组 中 选择 “ 选 定 的 ” 单 选 按钮 ， 选 择 bbsID 字段 。 
e 设置 “ 簿 选 ” 的 条 件 为 “bbsID=URL 参 数 (bbsID 
@ 将 “排序 ”设置 为 “无 ” 


名 称 : ksnain gg 
和 连接: EPE 
表格 : |bbsmain 


列 : 〇 全 部 ② 选 定 的 : 


图 7-73 设 定 rsmain“ 记 录 集 ” 


加 入 了 一 个 隐藏 区 域 ， 单 击 选择 该 隐藏 区 域 ， 在 “属性 ”面板 中 单 击 “ 动 态 数 
据 值 ”按钮 锋 ， 打 开 “ 动 态 数据 ”对 话 框 ， 单 击 选择 “ 域 ”列表 框 中 的 “记录 集 
(Crsmain)”， 在 展开 的 列 选 项 中 选择 “bbsID” 选 项 ， 单 击 “ 确 定 ” 按 钮 ， 则 将 bbsID 绑 定 到 
隐藏 区 域 的 “ 值 ” 中 。 设 置 如 图 7-74 所 示 。 


7 ”[ 第 一 个 记录 索引 ] 取消 


7 。 [最 后 一 个 记录 索引 ] 
7 [总 记录 数 ] 


格式 : 无 マ 


代码 : | < (rsmain. Fields. Item ("bbsTD") 


RE Ra 
国 询 阅 区 域 
aoi 攻略 [ee Gronain Fielis Tten bbsD").| 


图 7-74 加 入 隐藏 区 域 并 设置 动态 值 


ン < マー 
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与 讨论 主题 一 样 ， 回 复 主题 的 表单 提交 前 要 为 这 个 表单 加 入 “检验 表单 ”的 动 
作 ， 单 击 <forml> 标 签 ， 再 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “十 ”按钮 。 在 弹出 的 菜单 
中 ， 选 择 “ 检 验 表单 ” 选项， 打开“ 检查 表单 ”对 话 框 ， 设 置 所 有 字段 值 为 “必需 的 ” 并 
设置 相应 的 “可 接受 ”范围 ， 如 图 7-75 所 示 。 


Eh nut Gi sr emuame 5 EK) 


5 inpmat " "bbsrefurl” [RY 
textarea "bbsrefcontent" EE 


值 : 必需 的 


可 接受 : “2 任何 东西 [数字 
加 电子 邮件 地 址 〇 数字 从 | | 到 [ | 


图 7-75 设置 检查 表单 


单 击 “ 确 定 ” 按 钮 完成 检查 表单 的 操作 。 只 有 加 入 “插入 记录 ”服务 器 行为 ， 
才能 将 新 的 讨论 主题 新 增 至 数据 表 bbsref 中 。 执 行 “ 服 务 器 行为 ”面板 中 的 “插入 记录 ” 命 

， 打 开 “ 搬 入 记录 ”对 话 框 ， 按 下 面 的 参数 进行 设置 ， 如 图 7-76 所 示 。 

@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 连接 对 有 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 bbsref 数据 表 。 

@ 在 “插入 后 ， 转 到 :” 栏 中 输入 jforumy/forum.asp， 表 示 插 入 成 功 后 返回 该 页 面 。 

@ 从 “获取 值 目 ” 下 拉 玉 单 中 选择 建立 的 forml 表单 对 象 。 

@ 在 “表单 元 素 ”列表 框 中 把 表单 中 的 字段 和 数据 库 中 的 字段 一 一 对 应 。 


[五 下 


柄 . 尺 到 | 表格: bbsref し 取消 | 
a ssp EL 


获 职 值 自 : | fornl 三 提 变 时 ) 
表单 元 素 : は 中.」 


图 7-76 设置 “搬入 记录 ”对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 完 成 回复 讨论 页 面 reforum.asp 的 设计 ， 如 
7-77 所 示 。 


中 ni: い chapnTtforumtreforum.asp 【YHTL) -EX 
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图 7-77 ”完成 的 效 琳 


为 论坛 开发 一 个 后 台 管 理 功 能 也 是 必要 的 。 管 理 者 通过 合法 号 份 登录 后 ， 可 以 实现 对 讨 
论 主 题 的 修改 、 删 除 以 及 删除 回复 内 容 功 能 。 从 动态 功能 上 短 层 ， 实 现 这 些 功能 主要 也 是 通 
过 “服务 需 行 为 ”面板 中 的 “更 新 记录 ”和 “删除 记录 ”实现 。 


人 后 人 台 登 录 


由 于 管理 者 接口 是 不 允许 网 站 浏览 者 进入 的 ， 必 须 进行 权限 的 设置 。 

详细 制作 步骤 如 下 : 

局 动 Dreamweaver CS53， 执 行 菜 单 栏 中 的 “文件 ”一 “新 建 ” 命 令 ， 打 开 “ 新 
建文 档 ” 对 话 框 ， 选 择 “ 空 白 页 ”选项 卡 中 的 “页 面 类 型 ”列表 框 下 的 ASP VBScript 选 
项 ， 在 “布局 ”列表 框 中 选择 “无 ”选项 ， 然 后 用 鼠标 单 击 “ 创 建 ”按钮 创建 新 页 面 ， 输 入 
网 页 标题 “BBS 后 台 管 理 登录 ”， 执 行 菜单 栏 中 的 “文件 ”一 “保存 ”命令 ， 在 站 点 中 将 该 
文档 保存 为 admin login.asp。 

执行 菜单 栏 中 的 “插入 ”一 “表单 ”一 “表单 ”命令 ， 插 入 一 个 表单 。 

将 鼠标 指针 放置 在 该 表单 中 ， 执 行 菜 单 栏 中 的 “插入 ”一 “表格 ”命令 ， 打 开 
“表格 ”对 话 框 ， 在 “ 行 数 ”文本 框 中 输入 需要 插入 表格 的 行 数 为 4。 在 “ 列 数 ” 文 本 框 中 输 
入 需要 插入 表格 的 列 数 为 2。 在 “表格 宽度 ”文本 框 中 输入 400 像素 。 其 他 参数 保持 默认 
值 ， 如 图 7-78 所 示 。 

单 击 “ 确 定 ”按钮 ， 在 该 表单 中 插入 4 行 2 列 的 表格 ， 选 择 表格 在 “属性 ” 面 
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板 中 设 症 对 齐 方式 为 大 中 对 章 。 单 击 鼠 标 左 键 并 拖 忠 鼠标 选中 第 1 行 表 格 ， 选 中 表格 的 第 1 
行 后 ， 在 “属性 ”面板 中 单 击 “合并 所 选单 元 格 ， 使 用 跨度 ”按钮 中， 将 第 1 行 表格 合 
并 。 用 同样 的 方法 把 第 4 行 合并 。 


行 数 :4 | wal 
表格 宽度 
边框 粗细 : 0 ”| 情 素 
单元 格 过 距 : 0 | 
单元 格 间距 : 0 | 


辅助 功能 
标题 : 


对 齐 标题 


确定 


图 7-78 插入 表格 


在 该 表单 中 的 第 一 行 中 输入 文字 “BBS 后 台 管 理 登录 页 面 ” 在 表格 的 第 2 行 
中 的 第 1 个 单元 格 中 输入 文字 说 明 “ 用 户 :” 在 表格 的 第 2 行 中 的 第 2 个 单元 格 中 单 击 “ 文 
本 域 ” 投 钮 四， 插入 单行 文本 域 表 单 对 象 ， 定 义 文 本 域名 为 username。“ 文 本 域 ” 属 性 设置 
及 此 时 的 效果 如 图 7-79 所 示 。 


三 | 
mm 文本 域 字符 宽度 0) | 类 型 由 单行 (8) 〇 多 行 〇 密 品 @) 美 C) | 无 v 
最 多 字符 数 初始 值 加 ) 多 
」 禁 用 Q) 
口 只 读 @) 


| ni channrtforumtadmin_ 1ogin.asp [XHTML)* ーー 口 其 


图 7-79 插入 “文本 域 ” 的 设置 和 效果 网 
在 第 3 列表 格 中 输入 文字 说 明 “ 密 码 : ” 在 表格 的 第 3 列 中 的 第 2 个 单元 格 中 


单 击 “ 文 本 域 ”按钮 四， 插入 单行 文本 域 表 单 对 象 ， 定 义 文 本 域名 为 password。“ 文本 域 ” 
属性 设置 及 此 时 的 效果 如 图 7-80 所 示 。 


1 
区 文大 字符 宽度 由 | | 美 型 〇 単行 @ 〇 多 行 ⑪ 。 〇 密码 类 @| 无 “2 


上 多 字 和 数 初午 | ーー タイ 2 
器 禁用 四 ) 
画す 
守 ni い chapOTVfoyumtadmin_1ogin. asp CKHTML)* le 


后 台 管 理 


> <form. ><table> く tr><td> | 9 100% vv574dxl73v2K1 秒 简体 中 文 (GE2312) 


7-80 插入 “文本 域 ” 的 设置 及 效果 


单 击 选择 第 4 行 单元 格 ， 执 行 染 单 栏 中 的 “插入 ”一 “表单 ”一 “按钮 ” 命 
令 ， 重 复 执 行 一 次 则 插入 两 个 按钮 ， 并 分 别 在 “属性 ”面板 中 进行 属性 变更 ， 一 个 将 “ 值 ” 
设置 为 “登录 “动作 ”设置 为 “ 提 区 表单 ” 单 选 按钮 ， 忆 一 个 将 “ 值 ” 设 置 为 “ 重 放 ”将 
“动作 ”设置 为 “ 重 设 表单 ” 单 选 按钮 ,“ 属 性 ”的 设置 及 效果 如 图 7-81 所 示 。 
we 


按钮 名 称 値 ⑩ 动作 で 提交 表单 GE) 〇 元 类 加 | 无 A 
〇 重役 表 単 (8) 


3 


按钮 名 称 值 四 动作 〇 ) 提交 表单 G) 〇 元 ⑱ 类 加 | 无 A 
四 重 设 表单 @) 


TD tchannrtforumtadmin login. asp [XHTML)* - 口 其 


后 台 管 理 


“hody? <form#forml> 0% wl5TA x 173w 2 /1 秘 | 简体 中 让 (6B2312) | 
图 7-81 设置 按钮 名 称 的 属性 及 效果 


单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 [ 团 号 按钮 ， 在 弹出 的 菜 
单列 表 中 选择 “用 户 身 份 验证 /登录 用 户 ” 选 项 。 
打开 “登录 用 户 ” 对 话 框 ， 进 行 如 下 设置 : 
@ 从 “从 表单 获取 输入 ”下 拉 列 表 中 选择 该 服务 器 行为 使 用 网 页 中 的 forml 表单 对 象 中 
浏览 者 填写 的 对 象 。 
@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 username 对 象 ， 设 定 该 用 户 登 录 服 务 器 行 
为 的 用 户 名 数据 来 源 为 表单 的 username 文本 域 中 浏览 者 输入 的 内 容 。 
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@ 从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 访 用户 登录 服务 器 行为 
的 用 户 名 数据 来 源 为 表单 的 password 文本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
dsnforum 。 

@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 需 行为 使 用 到 的 数据 库 表 对 象 为 admin。 

@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 admin 存储 用 户 名 的 字段 为 username 字段 。 

@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 admin 存储 用 户 密码 的 字段 为 password 字段 。 

@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 回 /forumy/admin.asp 页 面 。 

@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 同人 /forumyforum.asp 负面。 

@ 选中 “基于 以 下 项 限制 访问 ”后 面 的 “用 户 名 和 密码 ” 单 选 按钮 。 

设置 如 图 7-82 所 示 。 


从 表单 获取 输入 : 
用 户 名 字段 : | username 
密码 字段 : password 
使 用 连接 验证 : | dsnforun 
表格 : | admin 
用 戸 名 列 : username v| 
密码 列 : password vy 


如 果 登 录 成 功 ， 转 到 : /forum/ admin. asp 训 览 ... 


し | 转 到 前 一 个 URL 如 果 它 存在 ) 
如 果 登 录 失败 ， 转 到 |: /forum/ forum. asp 训 览 .. 


基于 以 下 项 限制 访问 : (や 用 户 名 和 窗 码 
〇 ”用户 名 、 密 码 和 访问 级 别 
获 职 级 别 自 : 


图 7-82 登录 用 户 的 设 定 


执行 菜单 栏 中 的 “窗口 ”一 “行为 ”命令 ， 打 开 “ 服 务 器 行为 ”面板 ， 单 击 
iA 面板 中 的 加 号 “十 ”号 按钮 ， 在 打开 的 行为 列表 中 选择 “检查 表单 ” 命 

， 打 开 “ 检 查 表单 ”对 话 框 ， 设 置 username 和 password 文 本 域 的 “ 値 ” 都 为 “必需 的 网 
“可 接受 ， 为 “任何 东西 ” 单 选 按钮 。 如 图 7-83 所 示 。 


input "username (RK) 
. ~ ~ 


可 接受 : (や 任 何 未 丁 〇 数字 
〇 ) 电子 邮件 地 址 ”C 〇 数字 从 


图 7-83 设置 检查 表单 


单 击 “确定 ”按钮 回 到 编辑 页 面 ， 管 理 者 登录 页 面 admin login.asp 的 制作 已 
经 完成 ， 完 成 后 的 效果 如 图 7-84 所 示 。 


| D: (channrtforumtadmin login. asp [XHTHL) -口头 & 


‘hody? <form#forml> T4149w EA1 秘 简体 中 训 人 B2312) 


图 7-84 设置 管理 者 登录 界面 


7.5.2 


admin.asp 页 面 是 管理 者 登录 成 功 后 转 癌 的 管理 主页 面 。 这 个 页 面 的 主要 功能 是 显示 所 
有 讨论 主题 的 标题 ， 并 为 管理 者 提供 删除 和 修改 的 功能 。 管 理 主页 面 admin.asp 的 内 容 设 计 
与 系统 主页 面 forum.asp 大 致 相同 ， 不 同 的 是 加 入 可 以 转 到 所 编辑 页 面 的 链接 “修改 ”和 
“删除 ” 静态 部 分 的 设计 如 图 7-85 所 示 。 
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图 7-85 版 主管 理 页 面 的 设计 


具体 制作 步骤 如 下 : 
创建 好 静态 部 分 网 页 后 单 击 “ 绑 定 ”面板 中 的 “十 ”号 按钮 [ 国 ， 在 弹出 的 菜 
单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 。 
打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 ， 
如 图 7-86 所 示 。 


的 Dreamweaver CSSTASP 动态 网 站 建设 从 入 门 到 精通 


@ 在 “名 称 ” 文 本 框 中 输入 rsBB 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 

@ 从 “和 表格” 下拉 列表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 
@ 从 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 讽 首 “和 饥 选 ”的 条 件 为 “无 ”。 

@ 设置 “排序 ”的 条 件 为 “无 ”。 
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单 击 “ 高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 的 页 面 ， 将 现 有 的 SQL 语句 改 成 以 


下 的 SQL 语句 ， 如 图 7-87 所 示 。 


着丈 : 融和 
名 称 : rsEE 这 稼 。 snferwm 量 | | 定 生 


和 连接: | dsnforum a LT bb Tb 击 mal A bhaTin 所 
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图 7-86 疫 定 rsBB 记录 集 图 7-87 改写 SQL 语句 


01. SELECT 
02. bbsMain.bbsID, 
03. FIRST (bbsMain.bbsTime) AS bbsTime, FIRST (bbsMain.bbsHits) AS bbsHits, 


04. FIRST (bbsMain.bbsTitle) AS bbsTitle,FIRST (bbsMam.bbsurl) AS bbsurl, 
(bbsMain.bbsemail) AS bbsemail,FIRST (bbsMain.bbssex) AS bbssex, 


(bbsMain.bbsFace) AS bbsFace, FIRST (bbsMain.bbsContent) AS bbsContent, 


FIRST 
FIRST 


05. FIRST (bbsMain.bbsName) AS bbsName,COUNT(bbsRef.bbsMainID) AS ReturnNum, 


06. MAX(bbsRef.bbsTime) AS LatesTime 
07. FROM 

08. bbsMain LEFT OUTER JOIN bbsRef ON 
09. bbsMain.bbsID=bbsRef.bbsMainID 

10. GROUP BY bbsMain.bbsID 


比 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 forum.asp 页 面 的 适当 位 置 ， 如 图 


7-88 所 示 。 
选中 记录 集 有 数据 时 要 显示 的 单元 格 ， 如 图 7-89 所 示 。 


单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 ， 并 在 面板 中 单 击 “ 增 加 服务 


髓 行为 ”加 号 “十 ”按钮 ， 在 弹出 的 沫 单列 表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 不 为 空 


则 显示 区 域 ” 选 项 。 
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图 7-88 字段 的 绑 定 
图 sin [BD 3 
图 7-89 选择 要 显示 的 单元 格 


打开 “如 果 记 录 集 不 为 空 则 显示 区 域 ”对 话 框 ， 保 持 默认 值 ， 单 击 “ 确 定 ” 按 
钮 回 到 编辑 页 面 ， 则 发 现 之 前 所 选中 要 显示 的 区 域 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显 


示 ...” 的 灰色 卷 标 ， 这 表示 已 经 完成 设置 ， 如 图 7-90 所 示 。 
训 果 记录 集 不 为 空 则 显示 区 域 
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根据 前 面 的 步骤 ， 将 “目前 没有 发 表 任何 主题 ”区 域 设 定 成 “如 果 数 据 集 为 空 
则 显示 区 域 ” 如 图 7-91 所 示 。 

单 击 forum.asp 页 面 中 要 重复 的 记录 所 在 的 表格 ， 如 图 7-92 所 示 。 

再 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“十 ”号 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 。 


庆 琳 记 承 集 为 空 则 显示 区 城 
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图 7-91 如 果 数 据 集 为 空 则 显示 区 域 


7-92 选择 要 重复 的 列 


打开 “重复 区 域 ”对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 单 击 “ 确 
定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 左 上 角 出 现 了 一 个 “重复 ”的 灰色 
标签 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 网 7-93 所 示 。 
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7-93 ”设置 “重复 区 域 ” 


汉人 论坛 系统 


接 下 来 我 们 要 插入 “记录 集 导 航 条 ” 把 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 
位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导 航 条 ”按钮 一 |. 

打开 “记录 集 导航 条 ”对 话 框 ， 单 击 选择 “记录 集 ” 后 面 的 下 拉 三 角 按钮 ， 在 展 
开 的 菜单 中 选择 rsBB 记录 集 ， 然 后 单 击 选择 “显示 方式 ”为 “文本 ” 单 选 按钮 ， 最 后 单 击 
“确定 ”按钮 回 到 编辑 页 面 ， 页 面 中 将 自动 插入 记录 集 的 导航 条 ， 如 图 7-94 所 示 。 


记录 集 导航 条 


D \chayonN form\sdnin. ssp (XEINL) Bx 

COIR drnferm sp style ess 7 | 
1 し 上 ま に | 
! : テ * 4 ~ 。 

环 次 文化 艺 术 ， 半 次 了 让 注 下 滞 当 了 路 江 二 站 了 站 由 计价 
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图 7-94 添加 记录 集 导 航 条 
在 系统 管理 页 面 admin.asp 的 讨论 主题 中 加 上 “ 转 到 详细 页 面 ” 的 设 定 ， 是 为 
了 要 进入 讨论 主题 内 容 管理 页 面 delrefasp 进行 删除 回复 的 操作 。 首 先 选 中 页 面 中 的 标题 字 
段 {TrsBB.bbsTitle}， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 噩 行为 ”标签 中 的 加 号 “十 ” 鬼 


钮 ， 在 弹出 的 荣 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 
打开 “ 转 到 详细 页 面 ” 对 话 和 枉 ， 详 细 设置 如 图 7-95 所 示 。 


转 到 详细 页 面 


链接 : 
详细 信息 页 : /forum/ delref. asp 


传递 URL 参数 : bbsID 设置 池 以 下 项 的 值 
记录 集 : rsBB a 


列 : bbsID 


传递 现 有 参数 : [ ] URL 参 数 
| | 表单 参数 


图 7-95 设置 {rsBB.bbsTitle} 转 到 详细 页 面 


admin.asp 页 面 中 每 个 讨论 主题 后 面 都 各 有 一 个 “修改 ”和 “删除 ”按钮 ， 它 
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是 用 来 修改 和 删除 某 个 讨论 主题 的 ， 但 不 是 在 这 个 页 面 执行 ， 而 是 利用 “ 转 到 详细 页 面 ”的 
方式 ， 另 外 打开 一 个 页 面 来 执行 。 选 中 admin.asp 页 面 中 的 删除 按钮 ， 执 行 “ 服 务 器 行为 ” 
面板 中 的 “ 转 到 详细 页 面 ”功能 选项 。 

在 “ 转 到 详细 页 面 ”对 话 框 中 ， 详 细 设 置 如 图 7-96 所 示 。 


链接 : 
详细 信息 页 : /forumi deltitle. asp 


传递 URL 参 数 : bbsTn 设置 为 以 下 项 的 值 
记录 集 : rsBB マ 
列 : bbsTn マ 
己 暫 現有 参 数 : | | URL 参数 
| | 表单 参数 


图 7-9%6 设置 “删除 ” 转 到 详细 页 面 
用 同样 的 方法 。 设 置 “ 修 改 ” 按 钮 转 到 详细 页 面 adtitle.asp, 如 図 7-97 所 示 。 


链接 : 
详细 信息 页 : /forum/adtitle. asp 


传递 URL 参 数 : bbsTn 设置 为 以 下 项 的 值 
记录 集 : rsBB マ 
列 : bbsTn マ 
传递 现 有 参数 : | | URL 参数 
| | 表单 参数 


图 7-97 ”设置 “修改 ” 转 到 详细 页 而 


设置 限制 对 本 页 的 访问 功能 。 单 击 “ 应 用 程序 ”面板 中 “服务 器 行为 ”标签 中 加 号 
“十 ”按钮 。 在 弹出 的 染 单列 表 中 ， 选 择 “ 用 户 身 份 验证 /限制 对 页 的 访问 ”的 选项 ， 在 打开 的 
“限制 对 页 的 访问 ”对 话 框 中 单 击 选择 “用 户 名 的 密码 ” 单 选 按钮 ， 在 “如 果 访 问 被 拒绝 ， 则 转 
到 ”文本 杠 中 输入 jforumy/forum.asp， 表 示 如 果 访 问 补 拒绝 则 转 到 该 页 面 ， 如 图 7-98 所 示 。 


C 〇 ) 用 户 各、 密码 和 访问 级 别 


选取 级别 :| 


如 果 访 问 被 拒绝 ， 则 转 到 |: / forumy forum. asp | 


图 7-98 限制 对 页 的 访问 


单 击 “确定 ” 投 钮 ，admin.asp 负面 束 完成 设计 了 ， 完 成 后 的 效 来 如 图 7-99 所 示 。 
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7-99 完成 的 admin.asp 的 设计 效果 


月 删除 讨论 主题 页 面 | 


删除 讨论 主题 页 面 deltitle.asp 的 功能 不 只 是 删除 所 指定 的 回复 的 主题 ， 还 要 将 与 此 主题 
相关 的 回复 留言 从 数据 表 bbsref 中 删除 。 删 除 讨论 主题 页 面 设计 如 图 7-100 所 示 。 
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图 7-100 删除 讨论 主题 页 面 设计 


详细 步骤 如 下 : 

创建 删除 主题 页 面 deltitle.asp 的 毅 态 效 末 ， 然 后 单 击 “ 绑 定 ” 和 面板 中 的 加 扎 
“十 ”按钮 ， 在 弹出 的 荣 音 中， 选择 “记录 集 〈 和 三 询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 单 击 “高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 页 面 ， 将 现 
有 的 SQL 语句 改 成 以 下 的 SQL 语句 ， 如 图 7-101 所 示 。 

01. SELECT bbsmain.*,bbsref.*FROM 

02. bbsmam LEFT OUTER JOIN bbsref ON 

03. bbsmain.bbsID=bbsref.bbsmainID 

04. WHERE 

05. bbsmam.bbsID = queryID 
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: EEE 
i : | dsnforum ツマ 


: SELECT MT 
了 


Tt OIE mm ef ON 
bbs 


] 
名 称 : queryID 
半生: A 
est. querystring ("bbsI. . 


添加 到 SaL: 
SELECT 
DRDER BY 


图 7-101 改写 SQL 语句 
说 明 : 
上 图 中 设置 了 一 个 名 为 queryID 的 变量 值 ， 并 且 将 其 设 为 request.querystring(‘“bbsID””), 
传递 过 来 的 参数 。 
设 定 完 上 面 的 记录 集 绑 定 后 ， 还 需要 把 记录 集 deltitle.asp 中 的 字段 插入 到 网 页 
中 ， 如 图 7-102 所 示 。 
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图 7-102 deltitle.asp 中 的 字段 插入 


完成 页 面 的 字段 布置 后 ， 要 在 deltitle.asp 页 面 中 加 入 “删除 记录 ”命令 。 单 击 
“服务 器 行为 ”面板 中 的 加 号 “十 ”按钮 。 在 弹出 的 来 单 中 ， 选 择 “ 删 除 记 录 ” 选 项 ， 打 开 
“删除 记录 ”对 话 框 中 ， 按 照 下 面 的 参数 进行 设置 : 

@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 

@ 从 “从 表格 中 删除 ”下 拉 沫 单 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 

@ 从 “选取 记录 目 ” 下 拉 列 表 中 ， 选 择 detail 记录 集 。 

@ 从 “唯一 键 列 ”下 拉 列 表 中 选择 bbsID 字段 ， 并 单 击 选择 “数值 ” 复 选 杠 。 

@ 在 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 forml 表 単 。 

@ 在 “删除 后 ， 转 到 ”文本 框 中 输入 删除 后 转 到 的 页 面 为 /forumy/forum.asp。 

设置 的 对 话 框 如 图 7-103 所 示 。 


论坛 系统 


连接 ; 国 上 定义 ... 

从 表格 中 册 除 : bbsmain 
选取 记录 自 ; | detail 
唯一 键 列 : bbsID 


提 变 此 表单 以 删除 : ferml 。 
册 除 后 ， 转 到 : Eorum/Eorum. asp 


7-103 ”加 入 删除 记录 行为 


单 击 “ 确 定 ” 按 钮 ， 完 成 删除 讨论 主题 的 设置 ， 效 束 如 图 7-104 所 示 。 
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7-104 ”完成 的 设计 效果 


人 ア 修改 讨论 主题 页 面 


修改 讨论 主题 页 面 adtitle.asp 使 用 “更 新 记录 ”行为 实现 bbsmain 数据 表 中 数据 的 更 新 


修改 ， 页 面 的 静态 部 分 设计 如 图 7-105 所 示 。 
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图 7-105 修改 讨论 主题 页 面 设计 
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操作 步骤 如 下 : 

创建 adtitle.asp 网 页 的 静态 部 分 ， 单 击 “ 绑 定 ” 面 板 中 的 “+” 号 按钮 ， 在 弹 
出 的 菜单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 单 击 “ 高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 页 面 ， 将 现 
有 的 SQL 语句 改 成 以 下 的 SQL 语句 ， 如 图 7-106 所 示 。 


01. 
02. 
03. 
04. 
05. 


ER 


SELECT 中 


sre 
FROM bbsmain OUR mm bbsr ef ON 
bbsmain bhs ID= bbsref. bbsm 
WHERE bbsmain.bbsID = quer be 


名 称 : queryID 

N/A 
equest. querystring ("bbsI. . 

默 


认 信 :1 
| 编辑 .| 


添加 到 SQL: 


SELECT 


WHERE 


URIER BY 


本 类 ”预存 过 程 


图 7-106 改写 SQL 语句 


SELECT bbsmain.*,bbsref.*FROM 
bbsmain LEFT OUTER JOIN bbsref ON 
bbsmain.bbsID=bbsref.bbsmainID 
WHERE 

bbsmain.bbsID = queryID 


上 图 中 设置 了 一 个 名 为 queryID 的 变量 值 ， 并 日 将 其 设 为 request.querystring(“bbsID”), 
传递 过 来 的 参数 。 
设 定 完 上 面 记 录 集 绑 定 后 ， 需 要 把 记录 集中 的 字段 插入 到 页 面 上 ， 如 图 7-107 


所 示 。 
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图 7-107 adtitle.asp 中 的 字段 插入 


完成 页 面 的 字段 布置 后 ， 要 在 adtitle.asp 页 面 中 加 入 “更 新 记录 ”的 设 定 。 
执行 灯 单 柱 中 的 “窗口 ”一 “服务 器 行为 ”命令 ， 打 开 “ 服 务 占 行为 ”面板 。 单 击 该 面板 
中 的 加 号 “+” 授 钮 ， 从 打开 的 弛 单 中 选择 “更 新 记录 ”命令 ,打开 “更 新 记录 ”对 话 
框 ， 按 图 7-108 所 示 进 行 设置 。 OO) 


连接 : 
要 更 新 的 表格 : | bbsmain 
选 职 记录 自 : | dstsi1 
唯一 键 列 : | bbsID 
在 更 新 后 ， 转 到 : /forumy forum. asp 中 


获取 值 自 : | forml 
表单 元 未: EE 灶神 Rd 吉 | “bbstitle” 


列 : |bbstitle v| 


提 变 为 : | 文本 v 


图 7-108 加 入 更 新 记录 的 行为 


单 击 “ 确 定 ” 按 钮 ， 完 成 修改 主题 负面 的 制作 ， 此 时 的 效果 如 图 7-109 所 示 。 
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图 7-109 修改 页 面 的 完成 效果 


7 删除 回复 主题 页 面 | 


最 后 ， 我 们 来 设计 删除 回复 主题 的 两 个 页 耐 delerf.asp 和 delrefcontent.asp， 其 功能 是 
将 表单 中 的 数据 从 网 站 的 数据 表 bbsref 中 删除 。delrefasp 页 面 设计 和 detail.asp 相似 , 不 
同 之 处 就 是 delrefasp 在 显示 回复 内 容 栏 后 面 多 了 一 个 删除 回复 的 详细 链接 ， 其 页 面 设计 如 
7-110 所 示 。 


ン 和 の 
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悩 n:tchap0Ttforumtdelref.asp (KHTML) 
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发 表 人 : {detail. bbsname}: 
主题 内 容 ・ {detail. bbscontent} 


: {detail. bbsrefname} 


区 taetail bbstime} 顺 电子 邮件 ⑳ 主 


图 加 | 国 | 
body> く diy 幸 top> N |9 100% v949 x 526v 207 /5 秒 简体 中 站 (6B2312) 


7-110 delrefasp 页 面 的 设计 


具体 操作 步骤 如 下 : 

delref.asp 页 面 设计 和 主题 内 容 页 面 detall.asp 相似 ， 这 里 只 重 扣 介绍“ 删除 回 
复 ” 的 动态 设置 。 

单 击 选择 文字 “删除 回复 ”， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ” 
标签 中 的 加 号 “十 ” 投 钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 

打开 “ 转 到 详细 页 面 ” 对 话 框 ， 评 细 设 置 如 图 7-111 所 示 。 


等到 语 细 页面 


链接 : | 所 选 范 围 : “删除 回复 “ 
说 组 信息 页 
人間 URL 参数 设置 为 以 下 项 的 和 


mm 
传递 现 有 参数 : | ] um 参数 
| | 表单 参数 


7-111 设置 转 到 详细 页 而 


单 击 “ 确 定 ” 按 钮 ， 完 成 转 到 详细 页 面 的 设置 。 

创建 delrefcontent.asp， 设 计 如 图 7-112 所 示 。 

单 击 “ 绑 定 ”面板 中 的 加 号 “十 ”按钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 ( 査 
询 )” 选 项 。 
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7-112 页 面 delrefcontent.asp 的 设计 


打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 议定 ， 
如 图 7-113 所 示 。 
在 “名 称 ” 文 本 框 中 输入 Recordsetl 作为 该 记录 集 的 名 称 。 
从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 
从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsref。 
在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 
设置 “ 科 选 ”的 条 件 为 “bbsrefID= URL 参 数 / bbsrefID”。 
设置 “排序 ”条 件 为 “无 ” 


表格 


列 : で ) 全 部 。 局 选 定 的 : 


7-113” 绑 定 记 录 集 设 定 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 网 页 的 适当 位 置 ， 并 加 入 一 个 隐藏 字 


J 
or 
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段 bbsrefItD， 设 置 如 图 7-114 所 示 。 


域 : 日 還 记录 集 (Eecordsetl】 本 
bbsmainIl 
bbsreftname 
bbstime 
bbsrefcont ent 
bbsreftsex 
bhbsreturl 
bhsretmail 
[第 一 个 记录 索 5|] 


「- 上 月 广 一 -个 -3 才 寻 去 口 11 


テ 


发 码 : | 9 [Recordsetl. Fields. Tien ("bbsri 


BE 
I 隐 立 区 域 
上 从 [3 Racordsetl ia Tue Ubbsr| 2 


图 7-114 绑 定 隐藏 区 域 


完成 页 面 的 字段 布置 后 ， 要 在 delrefcontent.asp 页 面 中 加 入 “删除 记录 ”的 设 
定 。 早 击 “ 服 务 右 行为 ”面板 中 的 加 号 “十 ”按钮 。 在 弹出 的 且 单 中 ， 选 择 “ 有 删除 记录 ” 选 
项 ， 打 开 “ 删 除 记录 ”对 话 框 中 ， 按 照 下 和 面 的 参数 进行 设置 : 

@ 从 “连接 ”下 拉 末 蛙 中 选择 dsnforum 数据 源 连 接 对 象 。 

@ 从 “从 表格 中 删除 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsref。 

@ 从 “选取 记录 日 ”下 拉 列 表 中 ， 选 择 Recordsetl 记录 集 。 

@ 从 “唯一 键 列 ” 下 拉 菜 单 中 选择 bbsrefID 字段 ， 并 单 击 选择 “数值 ” 复 选 框 。 

@ 在 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 form1 表单 。 

@ 在 “删除 后 ， 转 到 ”文本 框 中 输入 删除 后 转 到 的 页 面 为 /forum/admin.asp。 

如 图 7-115 所 示 。 


な 
从 表格 中 删除 : bbsref 
选 职 记 录 自 : 


唯一 键 列 : |bbsrefID 
提交 此 表单 以 删除 : fornl 
册 隆 后 ， 转 到 : VEorumyradnmin as 


图 7-11$ 加 入 “删除 记录 ”行为 


单 击 “确定 ”按钮 ， 完 成 删除 回复 内 容 的 设置 ， 效 末 如 网 7-116 所 示 。 


C5. \ ehayor\ form\delrefeonlent, asp (TETHL) - Dx 
EIR dnferm op rtle css 


FA 


环 侯 文 化 艺术 ep 
DESC TR mie 


be 
body < く div@1 co > 


7-116 完成 删除 回复 后 的 页 面 效果 


] 80 HH 


博客 (Blog) 是 WebBlog 的 缩写 ， 人 和 


单 来 说 就 是 网 络 日 记 。 一 个 博客 系统 可 以 - 
认为 是 一 个 独立 的 个 人 网 站 ， 它 通常 是 由 -Wn 
简短 而 且 经 常 更 新 的 日 记 所 构成 ， 这 些 文 二 ”过 


FT rr 由 请 置 疡 生 无 并 的 间 
章 都 按照 年 份 和 日 期 排列 。 ーー 


本 章 的 实例 效果 


后 


教学 重点 


AAATIE 


博客 系统 开发 平台 に 

博客 系统 规划 の 
博客 系统 前 台 设计 に 
博客 系统 后 台 设计 に 


_Sectlon_ 


让 和 博客 系统 开发 平台 


本 章 使 用 ASP+Access 为 开 及 平台 开发 一 个 个 人 博客 系统 ， 该 系统 功能 比较 齐全 ， 用 户 
在 注册 后 可 以 及 布 个 人 日 记 ， 登 录 后 合 可 进行 目 我 管理 。 开 发 这 个 博客 系统 首先 需要 在 本 地 
搭建 博客 系统 的 开发 平台 ， 并 建立 静态 页 面 。 


骨 朋 月 使用 Photoshop CS5 分 割 图 片 


首先 使 用 Photoshop CSS 切片 工具 分 割 首 页 图 片 。 

首先 在 本 地 计算 机 的 D 盘 中 建立 站 点 文件 夹 chap08， 在 站 点 文件 夹 里 面 建立 
一 些 第 用 文件 来。 然后 从 光 检 中 找到 站 点 chap08/psd 文件 夹 中 的 index.psd 文件 ， 将 其 复制 
到 本 地 站 点 psd 文件 夹 中 。 

局 动 Photoshop CS5， 选 择 末 蛙 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开 目 页 
index.psd 文件 ， 可 分 制 的 效果 如 图 8-1 所 示 。 


画 四 mr 改 ” 加 


医用 


デーーー 


图 8-1 设计 的 首页 可 分 割 效果 

井 始 分 割 各 部 分 圏 語 , 育 先 分 割 最 上 面 的 Logo 所 在 行 的 图 片 ， 单 击 工具 箱 中 
的 “切片 工具 ”按钮 入， 按 住 鼠 标 左 键 从 场景 的 左上 角 拖 忠 到 标题 的 右 下 角 ， 如 图 8-2 所 
示 ， 图 中 虚线 框 绘制 的 就 是 切片 大 小 ， 切 片 后 左上 角 将 显示 一 个 园 国 图 标 。 


中 


临 ゴ 博 4 岁月 的 轮回 。 永 恒 的 记忆 |! 


8-2 Logo 部 分 的 切片 效果 


按 下 快捷 键 (CtrIHH〉 组 合 键 ， 打 开 辅 助 线 视图 ， 可 以 先 用 辅助 线 分 割 好 需要 
分 割 的 区 域 ， 再 按照 辅助 线 分 割 。 本 例 将 整个 网 页 分 割 成 15 个 小 图 片 ， 如 图 8-3 所 示 。 
ED | 


Er 介入) 本 而 硬 N 证 GiNj 前 而 站 
了 | Cr 
rn EL ss ===o。5。o。o。oo {= 


ee 


- 一 一 一 
- | に 


EE 回 らら いさ テ コー と 月 時 SFMWm だ で 日 


8-3 切片 整个 首页 的 效果 
选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 236,“ 扩 散 ” 模 式 ， 
“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 8-4 所 示 。 


有 上 赎 为 Web 和 和 说 各 有 启用 入 区 


OX 一 下 六 一 三 Device Centr si 


8-4 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “存储 ”按钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 “保存 在 ”后 面 的 
下 拉 三 角 按 钮 总 ， 选 择 建立 的 chap08 文件 夹 ， 其 他 保持 默认 值 ， 设 置 如 图 8-5 所 示 。 
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将 优化 结果 存储 为 


保存 在 O: spoe 半生 


我 最 近 的 文档 
四 
中 
我 的 文档 


我 的 电脑 


~ 


岡上 部 居 


立件 名 @) : index 保存 名) 


保存 美 型 C): WL 和 图 像 (x. htm]) 取消 


设置 : 默认 设置 
切片 : 所 有 切片 


8-5 “将 优化 结果 存储 为 ”对 话 框 设置 


区 ED 单 击 “ 保 存 ” 按 钮 ， 完 成 保存 切片 的 操作 。 打 开 保存 文件 的 路 径 ， 可 以 看 到 自 
动 生成 了 一 个 名 为 images 的 文件 来 ， 文 件 夹 里 是 前 面 切 片 后 产生 的 小 图 片 ， 由 这 些小 图 片 


组 成 了 首页 的 效 末 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 8-6 所 示 。 
ーー 


: 文件 ) ”编辑 代 ) 查看 名 ”收藏 入 ) 工具 て ) 帮助 而) 
Om OO - SS De Ba 国 - 


: 地 址 加 ) | 辐 D: \chap08\images 


辆 从 反 措 仪 或 照相 机 获 
舰 图 片 

人 作为 幻灯 片 查 看 

全 联机 订购 照片 

吊 打印 图 片 


文件 和 文件 夹 芷 务 


四 1 和 娃 一 个 新 文件 夹 
(| 将 这 个 文件 夹 发 布 到 


sy 共享 此 文件 来 


图 8-6 切片 的 小 图 片 


下 配置 博客 系统 站 点 服 和 器 


使 用 IIS 在 本 地 计算 机 上 构建 用 户 管理 系统 网 站 的 站 点 。 


配置 的 步骤 如 下 : 
首先 启动 IS, 在 IS 窗口 中 ， 右 键 单 击 “默认 网 站 ”选择 菜单 中 的 “属性 ” 


博客 系统 


命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 8-7 所 示 。 


网 站 标识 
描述 (8): 

IF 地 填 エ ): 
TCF 端口 J): 


连接 
连接 超时 他) : 
尽 | 保持 ITTF 连接 @) 


回 自用 日 志 记 录 @) 
活动 日 志 格式 ①: 
[Wac 扩展 日 志文 件 格式 司 [属性 加. 


图 8-7 “ 雪 认 网 站 属性 ”对 话 框 


单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 站 点 文件 夹 路 径 为 
“Di\chap08”， 其 他 保持 默认 值 ， 设 置 如 图 8-8 所 示 。 


网 站 ”ISAPI 第 选 器 | 主 目录 | 文档 “| 目录 安全 性 | TTF 共 | 自 定义 错误 | 
人 


O 另 一 台 台 计算 机 上 的 共享 8) 
〇 重 定向 到 VRL WU) 


本 地 路 径 (C): D: Acehap08 | 
中 脚本 资源 访问 民 ) 六] 记录 访问 WY) 
1 図 素 引 盗 源 エ ) 


口 目录 浏览 G) 
应 用 程序 设置 


应 用 程序 名 W): 默认 应 用 程序 册 除 ) 

开始 位 置 : < 铀 让 网 站 > 
| 配置 (@)...， | 

执行 椒 限 是 ): 纯 脚 本 EE. 


应 用 程序 保护 外 : 中 (共用 ) v 


8-8 设置 网 站 的 “本 地 路 径 


单 击 “确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 配置 ， 由 于 前 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 正 浏览 右 输 入 地 
址 http://127.0.0.1， 即 可 打开 页 面 切片 后 的 效 来 。 


使用 Dreamweaver CS5 进行 网 页 布局 设计 ， 首 先 需 要 用 定义 站 点 问 导 定义 站 点 ， 操 作 步 


骤 如 下 : 


Dreamvweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


打开 Dreamweaver CS5， 选 择 末 单 栏 中 的 “站 点 ”一 “ 写 理 站 点 ”命令 ， 打 开 
“管理 站 点 ”对 话 框 。 

单 击 右边 的 “新 建 ” 投 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ” 对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ” chap08。 

“本 地 站 点 文件 夹 ” D:\chap08\。 

如 图 8-9 所 示 。 


靖 点 设置 对 锚 chap08 


Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Drearmweaver 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文件 的 计算 机 上 的 本 地 文件 
夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 和 到 web 上 的 服务 器 上 的 远程 文件 夹 。 


您 可 以 在 此 处 当 Dreamweaver 站 点 选择 本 地 文件 夹 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 夹 ; 二 


图 8-9 设置 站 点 对 话 框 


单 击 “ 分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 器 名 称 ” chap08。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ”，D:chap08。 

“ Web URL”: http://127.0.0.1。 

单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 在 Dreamweaver CSS 中 就 已 经 拥有 
了 刚才 所 设置 的 站 点 。 

div 页 面 布 局 由 于 篇 幅 关 系 这 里 束 不 做 具体 的 介绍 ， 读 者 可 以 打开 光盘 源 代 码 进行 


_Section 


博客 系统 规划 


博客 系统 的 主要 结构 分 成 一 般 用 户 使 用 和 管理 员 使 用 两 个 部 分 ， 个 人 博客 系统 的 页 面 共 
由 20 个 页 面 组 成 ， 包 括 博 客 主页 面 、 博 客 分 闫 页面、 个 人 博客 主页 面 、 日 记分 类 页 面 和 后 
台 管 理 页 面 。 


CE 六 ;二 再 博客 系统 


博客 系统 的 页 面 设计 


每 一 个 注册 用 户 都 有 修改 、 删 除 目 己 日 记 的 功能 ， 系 统 页 面 的 功能 与 文件 名 称 见 表 8-1。 


表 8-1 博客 系统 将 要 开发 的 网 页 功能 


开发 的 页 面 页 面 名 称 功能 

博客 系统 主页 面 显示 最 新 博客 最 新 注册 等 信息 页 面 

分 类 页 面 列 出 所 有 博客 分 类 的 大 体内 容 

日 记 内 容 页 面 博客 分 类 中 子 内 容 的 详细 页 面 

个 人 主页 面 个 人 博客 主要 页 面 

日 记分 类 内 容 页 面 个 人 日 记分 类 的 内 容 页 面 

用 户 注册 页 面 新 用 户 注册 页 面 

管理 登录 判断 页 面 判断 登录 用 户 再 分 别 转向 不 同 页 面 

后 台 管 理 主页 面 一 般 用 户 管理 页 面 / 管理 员 管 理 页 面 
日 记分 类 管理 页 面 个 人 日 记分 类 管理 页 面 ， 可 添加 日 记分 类 
修改 日 记分 类 页 面 admin log typeupd.asp 修改 日 记分 类 的 页 面 

删除 日 记分 类 页 面 删除 日 记分 类 的 页 面 

日 记 列 表 管理 主页 面 个 人 日 记 列表 管理 页 面 ， 可 添加 日 记 
修改 日 记 列 表 页 面 修改 个 人 日记 的 页 面 

删除 日 记 列表 页 面 删除 个 人 日 记 的 页 面 

博客 分 类 管理 页 面 admin blog type.asp 管理 员 对 博客 分 类 管理 页 面 ， 可 添加 分 类 
修改 博客 分 类 页 面 admin blog upd.asp 管理 员 对 博客 分 类 进行 修改 的 页 面 
删除 博客 分 类 页 面 管理 员 对 博客 分 类 进行 市 除 的 页 面 
博客 列表 管理 主页 面 管理 员 对 用 户 博客 进行 管理 的 页 面 
推荐 博客 管理 页 面 管理 员 对 用 户 博客 是 否 推 荐 的 管理 页 面 
删除 用 户 博客 页 面 管理 员 对 用 户 博客 进行 删除 的 页 面 


数据 库 设计 


博客 系统 的 数据 库 命 名 为 blog， 并 在 里 面 分 别 建立 用 户 信息 表 users、 博 客 分 类 表 
blog type、 日 记 信息 表 blog log、 日 记分 类 表 log type 以 及 日 记 回 复 表 log reply 作为 博客 系 
统 数据 查询 、 新 增 、 修 改 与 删除 等 后 端 支 持 。 对 于 需要 创建 的 用 户 信息 数据 表 users、 博 客 
分 类 表 blog type、 日 记 信 息 表 blog log、 日 记分 类 表 log type 和 日 记 回 复 表 log reply 的 字 
段 结构 设计 和 分 析 如 下 : 

用 所 信忠 数 据 表 users 主要 用 来 存储 注册 用 户 的 信息 ， 并 上 其 有 统计 日 记 数 和 回 
复数 的 字段 ， 设 计 的 字段 和 数据 表 如 图 8-10 所 示 。 
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ED users 
了 字 反 名 个 


¥ user_iD 
typernsne 文本 
Uaer_Uaerrane 文 本 
user password 文本 
user_blog_namc 
uaecr_addtinc 
User nail 
uaer_port_rum + 
user reply_ris NF 
user_blog_sgood に い に コ 
user_blog_explain 备注 
user_level まそ 


图 8-10 


图 8-11 所 示 。 


图 8-11 
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-四 XX 
说 虽 < 
用 户 ID _ 
博客 分 类 名 
用 户 瘟 孚 有 
用 户 登录 密码 
用 户 博客 名 
注 志 时 间 
は 
入 育 日 志 数 


共 育 回复 数 
是 否 是 癣 三 博客 , 0 不 推荐 , 1 挫 稼 
博客 说 明 


i ic3 


小 数 江 右边 旺 示 的 垢 数 ， 


创建 的 users 用 户 信息 数据 表 
博客 分 类 表 blog type 用 于 存放 博客 创建 的 分 类 名 称 ， 


设计 的 字段 和 数据 表 如 


说 明 


nH 


博客 从 此 1 
EE 


宇 概 洛 語 時 証 可 居 本 邊 補 待 [ 竹 圧 宰 模 に 時 
F1 屋 可 查 轩 厅 基 二 入 者 乏 的 竹山 ， 


创建 成 的 博客 分 类 表 blog type 
日 记 信 息 表 blog log 主要 用 于 存放 用 户 编 号 的 日 记 内 容 ， 


其 中 设置 了 日 记 添 加 


时 间 和 及 布 时 间 两 个 了 字段， 设计 的 子 段 如 图 8-12 所 示 。 


国 Be lsg 
皇 民 者 数据 此 型 
Whog_Th = 
TT 幸 率 
lsg_slaga_ iD 動 字 
op_title 本 
lgE_ 看 过问 中 出 胃 二 目 期 /村 闻 
(1oB_reply_rim 十 
pbDate 日 期 , 计 闻 
pg mn 定 
车 吉 下岗 
| 李 和 去 小 に ニー | 
| 新 看 1 
| 喘 式 
万 时 
| 到 1 无 种 敌 ] 
立 李 嘲弄 5 
8-12 


= 本 其 ] 
说 明 也 
目 记 了 園 


1 


机 起 吉 必 是 长 可 到 中 个 订 符 [得 晤 全 丁 }。 按 
i 


日 记 信 息 表 blog log 


博客 系统 


日 记分 类 表 log type 用 于 储存 注册 用 户 创 建 的 日 记分 类 信息 ， 设 计 的 字段 如 图 
8-13 所 示 。 


国 log_type -中 x 
字段 名 称 | 数据 类 型 | 说 明 全 
Wlog_class_ID 自动 编号 日 记分 类 ID| 国 
user_username 文本 从 属 用 户 
log_class_name 文本 日 记分 类 各 
log_class_num 数字 当前 分 类 日 记 数 
Es 
字段 虱 性 
长 整 型 
递增 
に 字段 说 明星 可 选 的 。 用 于 帮助 说 明 该 字段 ,而 
受 且 当 在 窗 体 上 选择 该 字段 时 ， 也 在 状态 栏 上 有 显 


示 该 说 明 。 按 F1 键 可 坦 看 有 关 该 说 明 的 帮 
助 。 


图 8-13 日 记分 类 表 log type 


日 记 回 复 表 log reply 用 于 储存 日 记 回 复数 据 的 数据 表 ， 里 面 主要 建立 回复 日 
记 所 需要 的 孚 段 如 “回复 标题 和 “回复 时 间 和 “回复 内 容 ” 等 ， 设 计 的 log reply 数据 表 如 
图 8-14 所 示 。 


国 log_reply ーー i < 
字段 名 称 | 数据 类 型 说 明 一 
Br reply_ID 自动 编号 回复 ID 国 
_ |1og_ID 数字 日 记 ID 
reply_us er 文本 宇 复 人 姓名 
reply_title 文本 回复 标题 
reply_addtinme 日 期 7 时间 回复 时 间 
reply_content 备注 回复 内 容 
字段 层 性 
常规 倡 
字段 大 小 长 莹 型 
新 值 递 并 
格式 
标题 
索引 有 (无 重复 ) 
智能 标记 i 
和 字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 


F1 键 可 音 看 有 关 字段 名 称 的 帮助 。 


图 8-14 ”日 记分 类 表 log reply 


所 有 的 数据 表 都 是 在 Access 2007 里 面 完 成 的 ， 这 里 不 再 做 具体 介绍 。 
2% 创建 数据 库 连 接 
具体 连接 步骤 如 下 : 


执行 “控制 面板 ”一 “管理 工具 ”一 “数据 源 (ODBC)” 一 “系统 DSN” 选 
项 卡 ， 打 开 “ODBC 数据 源 管 理 右 ”对 话 框 中 的 “系统 DSN” 选 项 下 ， 如 图 8-15 所 示 。 
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在 打开 的 “系统 DSN” 对 话 框 中 单 击 “ 添 加 (D)” 按 钮 ， 将 打开 “创建 新 数 
据 源 ”对 话 框 ， 在 “创建 狐 数 据 源 ”对 话 框 中 ， 选 择 “Driver do Microsoft Access (*.mdb)” 
选项 ， 如 图 8-16 所 示 。 


#0DBC 数据 源 管理 器 
用 户 DSH 系统 DSH | 文件 SM | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系统 数据 源 (8): 选择 您 想 涯 其 安装 数据 源 的 驱动 程序 G)。 
有 
er do Microsoft Access I*.m 
o Microsoft dEase (*. dbf) 
o Microsoft Excel tt.xls) 
0 icrosoft Paradox Gr. db ) 


ase ] 
ase VFF Hriyer (*. dbf) 


图 8-15 ODBC 数据 源 管理 器 中 的 系统 DSN 图 8-16 创建 数据 源 


单 击 “完成 ”按钮 ， 打 开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 
源 名 (N)” 文 本 框 输入 blog， 单 击 “ 选 择 〈S)” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 枉 ， 单 击 
“驱动 器 (V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 二， 从 下 拉 列 表 中 找到 在 创建 数据 库 步 骤 中 数据 库 
所 在 的 盘 符 ， 在 “目录 (D) :” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 
左上 方 “ 数 据 库 名 (A)” 选 项 组 中 的 数据 库 文 件 blogmdb, 員数 据 麻 名 称 目 効 添加 到 “数 
据 库 名 “A)” 下 的 文本 框 中 。 如 图 8-17 所 示 。 

单 击 “确定 ”按钮 ， 返 回 到 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 选 项 
卡 中 。 在 这 里 看 到 “系统 数据 源 ” 中 ， 已 经 添加 了 了 “名称” 为 “blog”， “驱动 程序 ”为 
“Driver do Microsoft Access 〈(*.mdb )” 的 系统 数据 源 ， 如 图 8-18 所 示 。 


大 0DBC 数据 源 管 理 需 
用 户 DSH 系统 DSN| 文 件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 (8): 


数据 库 名 必 ) 目录 ⑪): 
bloz. mab| d: ‘chapD3‘\mdb 


blog. mdb 


0DBC 系统 数据 源 存 情 了 如 何 与 指定 数据 提供 程序 
统 数 据 源 对 当前 机 强 上 的 所 有 用 尸 可 见 ， 


文件 美 型 て ): 


IAccess 数据 库 (xk. me | | d: 新 加 卷 ”| 


图 8-17 选择 数据 库 图 8-18 ODBC 数 据 源 管理 器 


单 击 “ 确 定 ” 投 钮 ， 完 成 “ODBC 数据 源 管 理 堪 ”中 “系统 DSN” 的 设置 。 
局 动 Dreamweaver CSS$， 设 置 好 “站 点 入 “文档 类 型 ”和 “测试 服务 器 ”后 ， 打 开创 建 的 
index.asp 网 页 。 

在 Dreamweaver CS5 软件 中 执行 荣 单 栏 中 的 “文件 ”一 “窗口 ”一 “数据 库 ” 
命令 ， 打 开 “ 数 据 库 ”面板 ， 单 击 “ 数 据 库 ” 面 板 中 的 “十 ”号 按钮 ， 在 下 拉 荣 单 中 选择 
“数据 源 名 称 (DSN)” 命 令 。 


博客 系统 


打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 : ”文本 框 中 输入 blog， 单 
击 “ 数 据 源 名 称 (DSN): ”文本 框 右 侧 的 下 拉 三 角 按 钮 总 ， 从 打开 的 下 拉 菜 单 中 选择 建立 的 
blog， 其 他 保持 默认 值 ， 如 图 8-19 所 示 。 


数据 谭 名 称 (D5NH) 6 ] > 


SE 
数据 源 名 称 SN): 


密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSN 
〇 使用 本 地 nsW 


图 8-19 建立 数 据 源 名 称 


单 击 “ 确 定 ” 按 钮 ， 完 成 数据 库 的 连接 。 同 时 系统 将 在 网 站 根 目录 下 ， 自 动 创 
建 一 个 名 为 Connections 的 文件 夹 ， 而 且 Connections 文件 夹 内 包含 connblog.asp 数据 库 连 
接 文件 。 


二 一 EE * ル L ヽ 
博客 系统 前 台 设 计 
在 博客 系统 前 台 的 页 面 设 计 中 ， 首 页 index.asp 中 主要 由 博客 分 类 、 最 新 日 记 、 访 问 纪 
计 、 推 荐 博客 和 用 户 注册 等 几 大 栏目 组 成 。 用 户 登录 后 可 进入 个 人 博客 主页 面 和 个 人 博客 管 
理 页 面 ， 对 日 记 列 表 进行 修改 、 删 除 和 添加 操作 。 


8.3.1 


制作 博客 的 主页 面 index.asp， 博 客 系统 首页 index.asp 主要 由 博客 分 类 、 最 狐 日 记 、 文 


章 统计 、 推 荐 博客 和 用 户 登录 等 几 大 栏目 组 成 ， 其 页 面 设 计 效 果 如 图 8-20 所 示 。 


庫 圭 .L 画 証 = Mirrerat 


图 8-20” 主 页面 效果 图 


Dreamnvweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


制作 的 步骤 如 下 : 
启动 Dreamweaver CS$, 投 照 較 8-20 所 示 的 效果 图 在 Dreamweaver CSS 中 设 
计 毅 态 部 分 页 面 效 果 如 图 8-21 所 示 。 
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8-21 净 态 页 面 设计 图 


首先 设计 “用 户 登 录 ” 栏 目的 用 户 登 录 功 能 ， 单 击 鼠 标 选 择 <form1> 表 单 ， 执 
行 荣 单 栏 中 的 “窗口 ”一 “服务 器 行为 ”命令 ， 打 开 “ 服 务 器 行为 ”面板 。 单 击 该 面板 中 
“+” 号 按钮 ， 从 打开 的 菜单 中 选择 “用 户 身 份 验 证 ”一 “登录 用 户 ” 命 令 ， 打 开 如 图 8-22 
所 示 的 “登录 有 用户” 对话 框 ， 有 具体 参数 设置 如 下 : 
@ 从 “从 表单 获取 输入 ”下 拉 列 表 中 选择 该 服务 器 行为 使 用 网 页 中 的 form1 表单 对 象 中 
浏览 者 填写 的 对 象 。 
@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 user name 对象， 设 定 该 用 户 登 录 服 务 咒 行 
为 的 用 户 名 数据 来 源 为 表单 的 user name 文本 域 中 浏览 者 输入 的 内 容 。 
© “密码 字段 ”下 拉 列 表 中 选择 文本 域 user password 对 象 ， 设 定 该 用 户 登录 服务 器 
行为 的 用 户 名 数据 来 源 为 表单 的 user password 文本 域 中 浏览 者 输入 的 内 容 。 
@ “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
connblog。 
@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 器 行为 使 用 到 的 数据 库 表 对 象 为 users。 
@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 users 存储 用 户 名 的 字段 为 user_username 字段 。 
@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 users 存储 用 户 密码 的 字段 为 user password 字段。 
@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 问 /check.asp 页 面 。 
@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 问 /err.asp 页 面 。 
@ 选择 大 于 以 下 项 限制 访问 ”后 面 的 “用 户 名 和 密码 ” 单 选 按钮 ， 设 定 后 将 根据 用 
户 的 用 户 名 、 密 人 码 决 定 其 浏览 网 页 的 权限 。 


有 :博客 系统 


从 表单 获取 输入 : 
用 户 名 字段 : us er_UsSername 


密码 字段 : us er_password 


使 用 连接 验证 : connbloe 
表格 : users 
用 户 名 列 : user_username 
密码 列 : [user_password 
如 果 营 录 成 功 ， 转 到 : /check asp 


し | 转 到 前 一 个 URL(C 如 果 它 存在 ) 
如 果 登 录 失 败 ， 转 到 |: |/ err. asp 


基于 以 下 项 限制 访问 : (や ”用 户 名 和 密码 
〇 用 户 名 、 密 码 和 访问 级 别 
获取 级 别 自 : 


图 8-22 ”设置 “登录 用 户 ”对 话 杠 


“博客 用 户 ” 栏 其 实 束 是 显示 users 数据 表 中 的 最 新 记录 ， 单 击 “ 绑 定 ” 面 板 
中 的 加 号 “+” 按 钮 ， 在 弹出 的 采 早 中， 选择“ 记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 
框 ， 按 如 下 参数 进行 设置 ， 如 图 8-23 所 示 。 

@ 在 “名 称 ” 文 本 框 中 输入 Rsl 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connblog 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 users。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 设置 “ 饶 选 ”的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 列 表 中 选择 user ID 选项 ， 然 后 选择 “降序 ”的 排列 顺序 。 


SE:=1] 
: | E BL E 


:| usSers 


「 で ) 全部 いし 选 定 的 


er 


图 8-23 绑 定 Rsl 记录 集 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 全 index.asp 网 页 的 适当 位 置 ， 如 图 
8-24 所 示 。 
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加 入 “服务 器 行为 ”中 的 “重复 区 域 ”的 设 定 ， 单 击 要 重复 显示 的 行 ， 如 图 
8-25 所 示 。 


違 客 用 戸 : 


1 
Rs1 user_usernamel iRs1. user username} 
| 


图 8-24 插入 至 index.asp 网 页 中 图 8-25 ”选择 要 重复 的 行 
单 击 “ 应 用 程序 ” 群 组 面板 中 的 “服务 器 行为 ”标签 ， 并 单 击 面板 中 的 加 号 


“+ ”按钮 。 在 弹出 的 沫 单列 表 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 
显示 的 记录 数 为 5， 如 图 8-26 所 示 。 


图 8-26 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 先前 所 选取 要 重复 的 区 域 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

显示 出 最 新 注册 的 用 户 后 ， 访 客 可 以 单 击 用 户 名 进入 用 户 个 人 博客 页 面 ， 方 法 
是 首先 选取 编辑 页 面 中 的 Rsl.user username 字段 ， 如 图 8-27 所 示 。 

单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 上 的 加 号 “+” 按 钮 ; 在 弹出 
的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选项， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 按钮， 打开 “选择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 
为 user username， 如 图 8-28 所 示 。 


链接 : | "<%= (Rsl. Fields. Item (“user_us' 鼠 
详细 信息 页 : user. asp| 
传递 URL 参数 :user_username 设置 当 以 下 项 的 值 
记录 集 : | Rsl 


眶 窜 用 户 列 : | user_username 


传递 现 有 参数 : | ] um 参数 


[| 表单 参数 


re 1 
IEsl. user usernamei 


图 8-27 选择 字段 图 8-28 设置 “ 转 到 评 细 页 面 ” 


单 击 “确定 ”按钮 ， 完 成 对 “最 新 注册 ”栏目 的 制作 。 下 面 将 对 统计 栏目 进行 
设计 ， 需 要 进行 统计 的 栏目 包括 博客 数 、 日 记 数 和 回复 数 ， 可 以 在 记录 集 查 询 高 级 模式 中 的 


第 8 章 生 元 村 生 必 


SQL 语句 中 使 用 count(*) 函 数 进行 统计 。COUNT(*) 函数 不 需要 expression 参数 ， 因 为 该 函 
数 不 使 用 有 关 任何 特定 列 的 信息 。 该 函数 计算 符合 查询 限制 条 件 的 总 数 。COUNT(*) 函数 返 
回 符合 查询 中 指定 的 搜索 条 件 的 数目 ， 而 不 消除 重复 值 。 | 

单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 上 的 加 号 “+” 按 饥 ， 在 打开 的 列表 菜 (②) 
单 中 选择 “记录 集 (查询 )” 选项， 打开 “记录 集 ” 对 话 框 ， 按 图 8-29 所 示 设置 相应 的 参数 。 


=2| 
| 


: | onnb1og 


: SELECT count (*) as num 
FROM users 


由 表格 添加 到 SaL: 


及 ”视图 
田 糙 ”预存 过 程 -rr 


OFDER BY 


8-29” 绑 定 记录 和 集 Rs2 


SQL 语法 说 明 : 
SELECT count(*) as num 
FROM users 
/计算 所 有 用 户 博 客 数 
两 次 执行 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 上 的 加 号 “+” 按 钮 ， 在 打 
开 的 列表 六 蛙 中 选择 “记录 集 (会 询 )” 选 项 打开 “记录 集 ” 对 话 框 ， 在 打开 的 “记录 集 ” 
对 话 框 中 分 别 输入 如 图 8-30 和 图 8-31 所 示 的 参数 。 


=3| 


: | connblog 


: SELECT count (*) as mm 
FROM blog 1og 


添加 到 SgL: 


SELECT 


WHERE 


URIER BY 


本 长 ”预存 过 程 


8-30 ” 绑 定 记录 集 Rs3 


- アメ 
2 AAA 
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SQL 语法 说 明 : 

SELECT count(*) as num 
FROM blog log 
/计算 所 有 日 记 数 


名 称 : | 
连接 : cormblog 


SQL: SELECT count tk) as rm 
FROM log_reply 


+ 表 格 添加 到 SQL: 


月 视图 [suecr  ) 


田 六 ”预存 过 程 ーー 


ORDER BY 


图 8-31 ” 绑 定 记录 和 集 Rs4 


SQL 语法 说 明 : 

SELECT count(*) as num ， : 博 宫 统计 

FROM log reply hi 
1/ 计算 所 有 回复 数 内 ee 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 图 8-32 插入 全 index.asp 网 页 中 
全 index.asp 网 幢 的 适当 位 置 ， 如 图 8-32 所 示 。 

插入 学 段 后 对 “文革 统计 ”栏目 的 制作 已 完成 ， 现 在 来 设置 “推荐 博客 ”一 
栏 ， 推 荐 博客 的 条 件 应 为 users 数据 表 中 的 user blog good 等 于 “1”， 单 击 “ 应 用 程序 ” 面 
板 中 的 “ 绑 定 ”标签 上 的 加 号 “+” 投 钮 ， 在 打开 的 列表 沫 单 中 选择 “记录 集 〈 答 询 )” 选 项 
打开 “记录 集 ” 对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 中 输入 如 图 8-33 所 示 的 参 数 。 


名 称 : 3 
连接 : | conmb1og 
SQL: SELECT * 
FROM users 
WHERE user blog good=1 


添加 到 SgL: 


SELECT 


線 ”预存 过 各 


DRDER BY 


图 8-33 ” 绑 定 记录 集 Rs6 


第 8 章 CE 所 


SQL 语法 说 明 : 
SELECT * 
FROM users // 从 数据 库 中 选择 gbook 数据 表 
WHERE user blog good=1 // 选 择 的 条 件 为 user blog good 为 1 ST 
单 击 “确定 ”按钮 完成 对 Rs6 记录 集 的 绑 定 ， 然 后 将 Rs6 记录 集中 的 
user blog name 和 user username 两 个 字段 插入 到 页 面 的 适当 位 置 ， 如 图 8-34 所 示 。 DB、 


加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 行 ， 如 图 
8-35 所 示 。 
:推荐 铺 多 


J 二 一 ー = rs ーー 
RT ee '{RsB. user blog name} 
itRsB. user_blog name} < i 

IRsB. USer usernamel 


iTRsB. user_username} ' 
图 8-34 ”将 两 个 字段 段 插 入 到 页 面 中 图 8-35 ”选择 要 重复 的 行 
单 击 “应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 在 打开 “重复 区 域 ” 
对 话 框 中 设置 显示 的 记录 数 为 2， 如 图 8-36 所 示 。 


重复 区 域 


图 8-36 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 人 确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 之 击 选 中 要 重复 的 区 域 的 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

显示 出 推荐 用 户 的 博客 后 ， 用 户 可 以 单 击 博客 名 进入 用 户 个 人 的 博客 页 耐 ， 选 
中 编辑 页 面 中 的 Rs6.user blog name 字段 ， 如 图 8-37 所 示 。 


IRsB. user bloe namel 


iTRsE. User usernamel 


图 8-37 ”选择 字段 


单 击 “应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 弹出 


PP 
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的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 
为 user Username， 如 图 8-38 所 示 。 


链接 : | "< に (RsB.Fis1ds.Ttsm ("user_b1, v 
详细 信息 页 : user. ssp 


供 悦 URL 参 数 : user_username 设置 洲 以 下 项 的 值 
记录 集 : RsB 


列 | : USer USern e 
传递 现 有 戎 数 : [ ] umr 参数 
表单 参数 


图 8-38 ”设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 完成 对 “推荐 博客 ”栏目 的 制作 ， 在 “博客 分 类 ”栏目 中 主 
要 是 绑 定 blog type 数据 表 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 
在 打开 的 列表 菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 参 数 设 置 如 图 
8-39 所 示 。 


名 称 : El 
连接 : | connblog 
表格 : blog_type 


列 : で) 全 部 〇 选 定 的 : 


图 8-39 ” 绑 定 记录 集 Rs7 
单 击 “确定 ”按钮 完成 对 Rs7 记录 集 的 绑 定 ， 将 Rs7 记录 集中 的 typename 字 
段 插 入 到 页 面 的 适当 位 置 ， 如 图 8-40 所 示 。 
在 显示 博客 分 类 的 记录 数 时 要 求 显 示 出 所 有 的 博客 分 类 数 ， 而 目前 的 设 定 只 能 
显示 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 
行 ， 如 图 8-41 所 示 。 


TEsT. tvpenamel 
图 8-41 选择 要 重复 的 行 


学 :证 天 到 博客 系统 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 

弹出 的 菜单 列表 中 ， 选 择 “重复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 在 打开 “重复 区 

域 ”对 话 框 中 设置 显示 的 记录 数 为 “所 有 记录 ” 如 图 8-42 所 示 ， ー 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 他 

了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 Te 
显示 所 有 博客 分 类 后 ， 为 了 实现 单 击 博客 中 的 分 类 能 够 进入 博客 分 类 的 子 内 容 

页 面 ， 需 要 选中 编辑 页 面 中 的 Rs7.typename 字段 ， 如 图 8-43 所 示 。 


图 8-42 ”选择 一 次 可 以 显示 的 次 数 图 8-43 ”选择 字段 


选择 Rs7.typename 字段 后 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 
中 的 加 号 “+” 按 钮 ， 在 弹出 的 六 单列 表 中 选择 “ 转 到 详细 页 耐 ” 选 项 ， 在 打开 的 “ 转 到 详 
细 页 面 ” 对 话 框 中 单 击 “浏览 ”按钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 
blog type.asp， 将 “传递 URL 参数 ”设置 为 typename， 如 图 8-44 所 示 。 


链接 : | “<= (RsT. Fields. Iten ("typenam | 
详细 信息 见 : |blog_type asp 
传递 URL 参数 : |tymenams 设置 河 以 下 项 的 值 
记录 集 : RsT wv | 


列 : | typename | 
传递 现 有 套数 : | ] mr 佑 渺 
| ] 表单 参数 


图 8-44 设置“ 转 到 详细 页 面 ” 


单 击 “确定 ”按钮 则 完成 “博客 分 类 ”栏目 的 制作 ， 下 面 将 制作 “最 新 日 记 ” 
栏目 ， 最 新 日 记 用 到 的 是 日 记 信息 表 blog log， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 
的 加 号 “+” 按 钮 ， 在 打开 的 列表 菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 
框 ， 参 数 设 置 如 图 8-43 所 示 。 
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训 称 ”| 加 加 | 


和 连接: | ED 


靖 放 : 玩 v| 


排序 : |1og Tn | | 降序 v 


图 8-45 绑 定 记录 集 Rs5 


单 击 “ 确 定 ”按钮 则 完成 对 Rs5 记录 集 的 绑 定 ， 然 后 将 Rs5 记录 集中 的 字段 插 
入 到 页 面 的 适当 位 置 ， 如 图 8-46 所 示 。 

在 显示 最 新 日 记 的 记录 数 时 要 求 显示 部 分 日 记 ， 而 目前 的 设 定 只 能 显示 一 条 
记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 行 ， 如 
8-47 所 示 。 


最 新 日 南 0 
{Rs5. EE 3 { Es5. ii t {Rs5. lug titlel {Fs5. user_ usernamel 
1Rs5. lag addtimel {Rs5. 1ng addtime} 
图 8-46 ”插入 字段 图 8-47 ”选择 要 重复 的 行 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 ， 并 在 面板 上 单 击 “+” 
号 按钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 打 
开 “ 重 复 区 域 ” 对 话 框 中 设置 显示 的 记录 数 为 5， 如 图 8-48 所 示 。 

单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 会 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

为 实现 单 击 最 新 日 记 的 标题 即 可 进入 日 记 详细 内 容 页 面 查看 内 容 ， 需 要 选中 编 
辑 页 面 中 的 Rs5.log title 字段 ， 如 图 8-49 所 示 。 


Rs5.1ng titlel 


图 8-48 ”选择 一 次 可 以 显示 的 次 数 图 8-49 ”选择 字段 


博客 系统 


选择 Rs5.log_title 字段 后 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 
的 “+” 号 按钮 ， 在 弹出 的 染 单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 
面 ” 对 话 框 中 单 击 “浏览 ”按钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 
log_content.asp， 将 “传递 URL 参数 ”设置 为 log ID， 设置 如 图 8-30 所 示 。 


链接 : | "<%= (Rs5. Fields. Iten "log tit | 
详细 信息 页 : log_content.asp 


传递 UEL 参 数 : 1og_TI| ”设置 为 以 下 项 的 值 
记录 集 : [Rs5 司 
列 : log Tn | 
传递 现 有 参数 : | ] mm 参数 
し | 表单 参数 


8-50 ”设置 “ 转 到 详细 页 面 ”对 话 框 


早 击 “确定 ”按钮 ， 则 完成 对 博客 主页 面 index.asp 的 设计 与 制作 ， 完 成 后 的 
整体 效果 如 图 8-51 所 示 。 


| 
TT 回 


| 一 


:电量 十 字 .9 湯前 | 
Er も 
pop Re Peer ee credit 


肌 跨 日 更 _| 


| 22202 1 
貴士. Lag iitlel NEE. mear_ we | F : 


图 8-51 完成 的 设计 效果 


: ド 用 博客 分 类 页 面 


博客 分 类 页 面 blog type.asp 主要 用 于 显示 博客 分 关中 的 子 信息 页 面 ， 其 吏 态 设计 如 图 
8-52 所 示 。 


一 和 


文件 ぜ ) 编辑 (E) 查看 (7) 插入 (I) 修 改 W) 格式 (0) 命令 (C) 站 点 (5) 窗口 0) 帮助 中 | | 设计 器 v 


blog_type.asp ポ XX itchapn8tblog_type.asp 
| Adobe BrowserLab | BrowserLab 


in connblog.asp style. css 


加 Er ーー 紅 GP Veit 


aD 人 Eile ///D |/chsp08/b1og_type. ss 
m9 eB 合 地 址 : fil: |/chapO8/blog_type. asp 田 国 commblog 


sesssessssessssesssessssssseereesessessssesssessesesssessssessessssessssesssessseesseessssesseesessessessssessseseeeed 


: 博客 分 类 : 


sam 。。 lawg 
| 系 @|& 人 で ツ 人 る 恩田 

の 

日 加 站 点 - chap08 ⑪.. 文件 来 

田 - 伺 blog 立 件 来 

Cormections 立件 爽 
css 文件 夹 
1mage5 立 件 来 
mdb 文件 来 
psd 文件 来 
admin. asp dEB ASF 立件 
admin blog. asp 12EB ASF 立件 
admin blog_d. … 5EE ASF 立件 
admin_ blog g... TEE ASE 立件 ツ | 


关于 我 /新 闻 公 告 /我 的 好 友 / 晤 近 访 客 /最 新 评论 / 晤 新 留言 0 or OE 


一 


Ell 


| 


< 山 | 
<body> <divimid> <div. content> <table> <tr> <td> [R | gm GL T48 x 455y 267 K/ 5 秒 简体 中 总 (6B2312) 


HE 所 >| 类 无 vB7 生生 汪汪 AOL 
mes DE SO me 


单元 格 水平) 默认 ”vx| 宽 0) | 720| 不 换行 o) [] 背景 顔色 ⑤)「 | | 页 面 属性 ，. 
口 站 ”本 下 四) 黑人 > 高 の | 标题 0 口 


1 三 
所 || 医 


8-$2 blog type.asp 静态 页 面 效果 


人 制作 步骤 如 下 : 
创建 博客 分 闫 页面 blog _ type.asp， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ” 
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的 加 号 “+” 控 钮 ， 在 打开 的 列表 菜单 中 选择 “记录 集 〈 但 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 


框 ， 参 数 设 置 如 图 8-53 所 示 。 


| connb1og v | 


3 | msers 


の 全部 し ) 选 定 的 : 


User +L 


8-53 ” 绑 定 记录 集 Rs 


单 击 “确定 ”按钮 ， 则 完成 对 Rs 记录 集 的 绑 定 ， 将 Rs 记录 集中 的 字段 插入 到 


页 面 的 适当 位 置 ， 如 图 8-54 所 示 。 


图 8-54 插入 字段 


加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 行 的 ， 如 图 
8-55 所 示 。 
Rs user username} Rs. user blog namell{Rs. user_ email】 全 = mser addtimer HRs. user post rum} 
图 8-55 选择 要 重复 的 行 


单 击 “应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 显 示 的 记录 数 为 
1$， 如 图 8-56 所 示 。 


图 8-56 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

将 鼠标 移 至 要 加 入 “记录 集 导 航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 条 ”按钮 副 ， 在 打开 的 对 话 框 中 ， 选 中 要 导航 的 记录 集 以 及 导 
航 条 的 显示 方式 ， 单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 如 图 8-37 所 示 。 


图 8-57 插入 “记录 和 集 导航 条 ” 


一 和 
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选中 编辑 页 面 中 的 Rs.user blog name 字段 ， 如 图 8-38 所 示 。 

单 击 “应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 
的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 投 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 为 
User_Username， 设 置 如 网 8-59 所 示 。 


链接 : "<%= (Rs. Fields. Iten ("user_blo; ww | 
详细 信息 页 : nser. asp 


传递 URL 参 数 : user_usernane 设置 为 以 下 项 的 值 


皇 寄 种 : 口 表单 参数 


{Rs. user usernamel :{Rs. us er_blog name}: 


8-58 选择 字段 8-59 ”设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 选择 Rs.user_email 字段 在 “属性 ”面板 中 “链接 ”文本 框 后 面 的 “浏览 
文件 ”按钮 回 ， 打 开 “ 选 择 文件 ”对 话 框 ， 在 该 对 话 框 中 单 击 选 择 “数据 源 ” 单 选 按钮 ， 在 
“ 域 ” 列 表 框 中 单 击 选择 “记录 集 (Rs)” 中 的 user email 字段， 并且 在 URL 链接 表面 加 上 
mailto:， 如 图 8-60 所 示 。 

单 击 “确定 ” 按 钮 ， 则 完成 博客 分 类 页 面 blog type.asp 的 设计 与 制作 ， 效 末 如 
图 8-61 所 示 。 


DW eo a FOV BAD KEEN FEO 全 分 人) MAE WO NW 责 4 溃 マ 


域 :| 日 入 机 


WTA 了 0 全 woor muil] Rh woor ebivioal Ba wsor gaat men) 


多 

多 

多 
人 
… 銀 ser_blo 
に っ を 

チ 

乡 

多 


格式 : | 无 wv| 


URL: mailto: <¥%= (Rs. Fields. Item (“user_email"). | 
在 站 点 定义 中 更 改 默认 的 凡 接 相对 于 


确定 
し リィ アッー 


を ま 
TN EN 0 pal 


8-60 ”设置 给 对 方 发 送 email 的 URL 链接 8-61 页面 blog type.asp 的 完成 效果 


天 并 前 日 记 内 容 J 面 " 。  )，) 


日 记 详 细 内 容 页 面 log_content.asp 除了 用 于 显示 日 记 的 详细 内 容 和 访客 留言 信息 外 ， 还 


应 为 访问 者 提供 一 个 留言 板 ， 日 记 内 容 负 面 的 设计 效果 如 图 8-62 所 示 。 
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关于 我 /新 闻 公告 /我 的 好 友 / 晤 近 访客 /最 新 评论 / 景 新 留言 GMR 


E-mail: jambola12B. com 


图 8-62 日 记 内 容 页 面 效果 


设计 步骤 如 下 : 

创建 日 记 详细 内 容 页 面 log contentasp， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ?” 
标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 亲 单 中 选择 “记录 集 (人 查询)” 选 项 ， 打 开 “ 记 录 
集 ” 对 话 框 ， 参 数 设置 如 图 8-63 所 示 。 

绑 定 记录 集 后 ， 将 记录 集 Rsl 中 的 字段 插入 全 log content.asp 网 页 的 适当 位 

如 图 8-64 所 示 。 
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- BA dieu 
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loz TI Pe 
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UsSer UsSername 
log class a 
loz 和 


|- 


log addtime 
[a 


8-63 ” 绑 定 记录 集 Rs1 8-64 ”插入 Rsl 记录 集中 的 字段 


再 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ” 标 签 中 的 加 号 “+” 按钮 ， 在 打开 的 列 
表 荣 单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 和 集 ” 对 话 框 ， 具 体 参 数 设 置 如 图 8-6 所 
示 。 

绑 定 记录 集 后 ， 将 记录 集 Rs2 中 的 字段 插入 至 log content.asp 网 页 的 适当 位 

如 图 8-66 所 示 。 


一 和 
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EF | 

same 
名 称 : 邢 FE fr mm 
和 连接: | connblog 


表格 :| log_reply 


列 : @ 全 部 〇 选 定 的 : 
reply ID 


reply title 
D] addtime 


筛选 : 1。g Tn MI = 


| URL 参数 | hog Tn 


8-65 绑 定 记录 集 Rs2 8-66 插入 Rs2 记录 集中 的 字段 


加 入 “服务 此 行 为 ”中 “重复 区 域 ” 设 是 ， 蛙 击 log content.asp 页面 中 记录 的 
那个 表格 ， 如 图 8-67 所 示 。 


いて て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て すす て て て 
て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て す て て て て て て て て て て て て て て て て て て て て て て て て て て て て すす て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て す て て て て て すす て て すす て て て て て て て て て て て て て て すす て て すす すす て すす て て す て すす 1 


8-67 选择 要 重复 的 表格 


单 击 “应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 中 ， 选 择 “重复 区 域 ” 选 项 ， 在 打开 “重复 区 域 ” 对 话 框 中 ， 设 置 显示 的 记录 数 
为 5， 如 图 8-68 所 示 。 


图 8-68 选择 显示 的 记录 数 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 


一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 网 8-69 所 示 。 
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トト ささ ささき きさく くさ やき や や やき や や やや や や や や や や や きき や や や や や や や やや や や やき や や やや や や や や や や や や や や や や やや や や やや や や や や や や や や や や や や や や や や や や や や や や や や きき やや や やや や や やや や やや や や や や や や やや や や や やや や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や やや や きく きく くき て 
トト ささ ささき きき や きき てき きき やや や や や きき やや や や や や やや や やや や や や や や や や や や やや や や や や や や や や や や や や や や や や や や や や や や や やや や や や や や やや や や や や や やや や や や や や や や や や や や やや や やや や や や や や や やや や や や や や や や や やや や や や や や やや や や や や や や や や や や や や や や や や や や や や や や や や や や やや や や や や や や や きき て 


て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て すす て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て 1 


8-69 完成 次 定 “軍令 区 域 ” 


接 下 来 要 在 log content.asp 中 加 入 “记录 集 导航 条 ”， 以 便 分 页 显示 回复 的 数 
据 ， 在 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 中 


党 第 8 章 他 :学 


的 “记录 集 导 航 条 ”按钮 副 ， 打 开 “ 记 录 集 导航 条 ”对 话 框 ， 选 中 要 导航 的 记录 集 以 及 导 


航 的 显示 方式 ， 然 后 单 击 “ 确 定 ” 投 钮 回 到 编辑 页 面 ， 此 时 页 面 则 出 现 该 记录 集 的 导航 条 。 


读者 可 以 修改 其 文字 效果 如 图 8-70 所 示 。 


记录 和 集 导航 条 


显示 方式 : @ 文本 


〇 OC 图像 


日 记 标 题 : {Rsl. log title} 


は エエ エエ エエ エト で エエ エエ エエ エエ エエ エエ エエ で ト エ エエ エマ ミエ エエ マ マエ で エエ エエ で で 


日 记 内 容 : {Rs1.log_content} 


トス ネト トト エ エエ エエ エエ エエ エエ エエ エエ エ エエ エエ エト エ エエ エ エエ エエ マ ママ エマ エエ マエ ママ で で エマ エマ エエ エ エエ マ エエ マ マエ エエ エエ で エマ エエ エエ エエ マエ エエ エエ マ マエ マエ エエ マ ママ エマ エエ エエ エエ エエ エエ エエ エエ マ エマ エエ エエ マエ マ エマ エエ エエ エエ エエ エエ マエ マエ マエ ママ ママ マエ エエ マエ エエ エエ エエ エエ エエ エエ マエ エエ エエ で マリ 


写 稿 人 : {Rs1.nssr_usernamei ” 写 摘 时 间 : {Rs1.1og addtime} 


トス スト トト トト トト トト エ エト トト トト トト ト トト トト トト エ エト エト エエ ささ エエ エエ エエ エエ マエ で で エエ で エエ エエ エエ エエ エエ エエ で エエ エエ エエ エエ エエ エエ で で で ママ マエ で エエ エエ エエ エ エエ エエ エ エエ エエ エエ エエ エ エエ エエ エエ エエ エエ エエ エト エエ エエ さ エエ エエ ママ エエ エ エエ エマ エエ エエ エ エエ エ エエ エエ さ エエ で で で 


如 采 冬 合 此 条 件 则 显示 . . . 


ww 


回复 标题 : {Rs2. reply_title} 


トト ト トト トト エ エマ エエ エエ エマ エエ マエ エエ エエ エ エエ エエ で で で で で で で で で で で で で で エト エエ エ エエ エエ エエ エエ エエ エエ エエ マ ミエ エエ エエ エエ エエ エエ で エエ で エエ エエ さ エエ エエ エエ エエ エエ エエ エエ エエ ママ エエ エエ エマ エマ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エマ エエ エエ エエ エマ エエ エエ エエ エエ で で で で で 


回复 内 容 : {Rs2. reply_content} 


は ユエ トト エエ エエ マエ マエ マ エエ エマ エマ エエ エエ エエ エエ エエ エマ エマ エマ で で エエ エエ エ で エエ エエ エエ エエ エエ エ エエ エエ マネ エエ エマ エマ エエ エ エエ エエ エエ エエ エマ で エマ で エエ マ エマ エエ エエ マエ エエ エエ エエ ママ エエ で エエ エエ マ エネ エエ エエ エエ エ ネエ エエ エエ マエ エエ マエ エエ エマ エマ エエ エマ ママ エマ エエ エマ エマ エエ エエ マエ で で で で で 


回复 人 : {Rs2. reply_user} 回复 时 间 : {Rs2. reply_addtime} 


トト トト トト トト エ トミ エエ エエ エエ エ ミエ エエ エ エエ エエ で で エマ エエ で で で で エエ エエ で で で エエ エエ エエ エエ エエ エエ エエ エエ エエ エ ミエ エエ エエ エエ で ネエ で で エエ そ で で エエ エエ エエ エエ エエ で で エエ で エエ で エマ エエ エネ エエ エマ エネ エ エエ エエ エエ エエ エエ そ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ マエ エエ エエ エエ エエ で で で で で 


員 末 符合 此 祭 件 如 果 符合 此 条 件 吉 果 符合 此 き 如果 符合 此 


8-70 加 入 “记录 集 导 航 条 ” 


首先 选 中 记录 集 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-71 所 示 。 


エモ トミ トキ トキ キモ モミ キキ キモ モモ モモ モモ モモ モモ モモ モモ モモ モモ モモ 


回复 标题 : {Rs2. reply title} 


も も も も も モモ モモ モモ モモ モモ モモ モモ モモ モモ モモ モミ モモ モモ モモ も モモ モモ モモ で モモ モモ モモ で モモ モモ モモ で モモ モモ モモ で モモ 


回复 内 容 : (REE. replyw_content} 


和 


回复 和: {Rs2. reply user} 回复 时 间 : (EEE replyw _ addtime} 


WW hh 


图 8-71 选中 有 记录 时 显示 的 表格 


单 击 “服务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 显 示 
区 域 ”一 “如 果 记 录 集 不 为 空 则 显示 区 域 ” 选 项 ， 在 打开 的 “如 果 记 录 集 不 为 空 则 显示 区 
域 ”对 话 框 中 选择 记录 集 为 RS2， 再 单 击 “确定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 显示 
的 区 域 左 上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 ...” 的 灰色 卷 标 ， 这 表示 已 经 完成 设 定 ， 


如 图 8-72 所 示 。 


如 果 记 录 集 不 为 空 则 显示 区 城 


图 8-72 ”完成 设置 的 显示 图 标 
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选择 没有 回复 数据 时 要 显示 的 文学 “目前 无 回复 内 容 ， 请 回复 !*”， 根 据 前 面 的 
制作 步 又 ， 将 下 和 面 区域 设 定 成 “如 果 记 录 集 为 空 则 显示 区 域 "”” 如 图 8-73 所 示 。 


襄 果 记录 和 集 为 空 则 显示 区 城 


记录 条 
al | 取消 | 
下 助 J 


In 末 符 合 此 条件 則 品 示 . 議員 ば : 
目前 无 回复 内 容 ， 博 回复 ? | Re RT TE EO A NA : 


图 8-73 ”选择 没有 数据 时 的 显示 内 容 


下 面 将 制作 “回复 栏 ”” 回复 栏 和 表面 的 留言 板 系统 一 样 ， 将 回复 的 信息 添加 
到 数据 表 log reply 中 ， 设 计 中 表单 forml 中 的 文本 域 和 文本 区 域 设 置 见 表 8-2， 其 静态 页 面 
设计 效果 如 图 8-74 所 示 。 


表 8-2 form1 中 的 文本 域 和 文本 区 域 设置 


文 本 (区 ) 域 /按钮 名 称 类 型 
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ここ EY 


ll 
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标题 : 
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一 | 
で * 
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ee Ot 
图 8-74 回复 栏 的 静态 页 面 设 计 效 果 
执行 菜单 栏 中 的 “插入 记录 ”一 “表单 ”一 “隐藏 区域” 命令 ， 在 表单 中 插入 


一 个 隐藏 区域 ， 单 击 选择 该 隐 饿 区 域 ， 在 属性 面板 中 设置 名 称 为 log ID ， 值 等 于 
<%=request.querystring("log ID")%>// 其 中 Request.QueryString 就 是 获取 你 请 求 页 面 时 传递 的 


学: 二 请 了 博客 系统 


参数 ， 设 置 如 图 8-75 所 示 。 
it pm っ っ = ラ 
IN| | 
legI | 信和 MD | 人 request, querystring("log_ID")| 多 SF 


图 8-75 ”设置 隐藏 区 域 


选择 “应 用 程序 ”一 “服务 器 行为 ”面板 中 加 号 “+” 按 钮 ， 在 弹出 的 选项 
中 ， 选 择 “ 插 入 记录 ”选项 ， 打 开 “ 插 入 记录 ”对 话 框 ， 具 体 设置 参数 如 图 8-76 所 示 。 


EE 
插 六 到 表格 : log_reply w| 
插入 后 ， 转 到 : log_content. asp | 浏览 


获 职 值 自 : fornl 回 三 提交 时 ) 


表单 元 来 : | 生生 pl 1 
|1og_TD 神 涩 值 ) 

EE ti ee rl. title" 

reply_content 质 入 到 | 列 中 “Yeply_content” 中 


列 |: |reply_ 1ser a 


提交 为: | 文本 v 


图 8-76 设置 “搬入 记录 ”对 话 框 


早 击 “人 确定 ”按钮 ， 回 到 编辑 页 面 ， 完 成 插入 记录 的 设计 。 

加 入 “检验 表单 ”行为 。 具 体操 作 是 在 log_content.asp 的 标签 检测 区 中 ， 单 
击 <form1>0 标签 ， 然 后 单 击 “ 行 为 ”面板 中 的 “+” 号 按钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 检 
验 表 单 ” 命 令 ， 检 验 表 单行 为 会 根据 表单 的 内 容 设 定 检查 的 方式 ， 在 此 为 了 使 访问 者 全 部 
填写 ， 在 “ 值 ” 后 面 选择 “必需 的 ” 单 选 按钮 ， 这 样 就 可 完成 检验 表单 的 行为 设 定 了 ， 设 
置 如 图 8-77 所 示 。 


[input reply_ user” IE 
plr title" BE 
‘reply content” TR 


: で 在 何 东 西 〇 数字 
( 〇 电 子 邮件 地 址 〇 数字 从 | | 到 | | 


图 8-77 检验 表单 
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单 击 “ 确 定 ” 按 钮 ， 完 成 日 记 详 细 页 面 log content.asp 的 设计 与 制作 ， 完 成 后 
的 页 面 效 果 如 图 8-78 所 示 。 
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8-78 ”日 记 详细 页 和 面 log_content.asp 的 效果 图 


博客 个 人 主页 面 


博客 个 人 主页 面 userasp 主要 由 日 记分 类 、 最 新 留言 及 日 记 内 容 儿 个 栏目 组 成 ， 静 态 页 
面 的 设计 效果 如 图 8-79 所 示 。 
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法 表 于 : ”详细 内 容 
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关于 我 /新 闻 公 告 /我 的 好 点 /县 近 访客 /最 新 评论 /县 新 鲁 


| 
<body> <div#bottom> <div#copyright>Kime】] 


图 8-79 个 人 博客 主页 面 效 果 


博客 系统 


详细 的 制作 步骤 如 下 : 

创建 userasp 前 态 页 面 ， 因 为 博客 主页 和 面 和 博客 分 类 页 和 面部 由 
user usernameURL 变量 传递 到 userasp 页 面 ， 因 此 可 以 用 user username 字段 的 “URL 参 
数 ” 建 立 一 个 日 记 的 记录 集 。 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 
钮 ， 在 打开 的 列表 沫 单 中 选择 “记录 集 (查询)” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 其 体 参 数 
设置 如 图 8-80 所 示 。 


名称 


和 连接: cormbloe | EY. 


下 格 : 


列 : で) 全 部 ”中 选 定 的 : 


4 


图 8-80 ” 绑 定 记录 集 Rs1 
单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs1 的 绑 定 ， 把 绑 定 的 Rs1 中 的 字段 插入 到 个 
人 博客 主页 面 的 适应 位 置 ， 如 图 8-81 所 示 。 


是 。 永 恒 的 记忆 1! 


小 表 于 : {Rs1.log_addtime} 详细 内 容 


关于 我 /新 闻 公 堂 /我 的 好 点 /最 近 访 客 / 最 新 评 众 /最 新 贸 


图 8-81 插入 字段 


在 个 人 博客 主页 面 中 应 显示 所 有 日 记 或 部 分 日 记 的 记录 ， 而 目前 的 设 定 只 能 显 
未 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 右 行 为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 表 
格 ， 如 图 8-82 所 示 。 
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图 8-82 ”选择 要 重复 的 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 设 置 显示 的 记录 数 
为 5， 如 图 8-83 所 示 。 


图 8-83 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

加 入 “记录 集 导航 条 ”以 便 分 页 显示 日 记 的 数据 ， 将 鼠标 移 至 要 加 入 “记录 集 
导航 条 ”的 位 置 ， 单 击 “ 揪 入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导 航 条 ”按钮 国 ， 在 
打开 的 “记录 集 导 航 条 ”对 话 框 中 ， 选 中 要 导航 的 记录 集 以 及 导航 的 显示 方式 ， 然 后 单 击 
“确定 ”按钮 回 到 编辑 页 面 ， 此 时 页 面 则 出 现 该 记录 集 的 导航 条 。 读 者 可 以 修改 其 文字 效 
果 ， 如 图 8-84 所 示 。 
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8-84 加 入 “记录 集 导 航 条 ” 


第 8 章 導 CE 


把 鼠标 移 全 要 加 入 “记录 集 导 航 状 态 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 状 态 ” 按 钮 蜀 ， 打 开 “ 记 录 集 导航 状态 ”对 话 框 ， 选 中 要 显示 状 
态 的 记录 集 后 ， 再 单 击 “确定 ” 投 钮 回 到 编辑 页 面 ， 此 时 页 面 则 出 现 该 记录 集 的 导航 状态 ， 
设置 及 效 朱 如 图 8-85 所 示 。 


a 记录 1 到 5 (总 共 10 个 记录 


a 回 ES 
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8-85 加 入 “记录 集 导航 状态 ” 


插入 “记录 集 导 航 条 ”和 “记录 集 导 航 状 态 ” 后 选中 编辑 页 面 中 的 “详细 内 
容 ” 文 字 ， 有 再 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 
的 沫 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选择 站 点 中 的 log_content.asp， 将 “传递 URL 参数 ” 
设置 为 log ID， 设 置 如 图 8-86 所 示 。 


苇 到 年 细 砚 面 


i 
人 iRr 参数 .oe_ 配 | 设 轩 为 以 下 项 的 人 


列 
传递 现 有 参数 ; 站 umr 参数 
| ] 表单 参数 


8-86 ”设置 “ 转 到 详细 页 面 ”对 话 框 


单 击 “ 确 定 ” 按 钮 ， 完 成 个 人 博客 主页 面 中 的 日 记 内 容 栏目 制作 ， 现 在 对 日 记 

分 类 这 一 栏 进行 制作 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “十 ”按钮 ， 在 打 

开 的 列表 菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 杠 ， 参 数 设 置 如 图 8-87 
所 示 。 


に ン コー 
ンー 


アオコ Dreannweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


名 称 : 噩 


连接 : | connblog 


表格 : log type 


列 : で 全 部 〇 选 定 的 : 


第 选 : Pe 
排序 : | 无 


图 8-87 ” 绑 定 记录 集 Rs2 
单 击 “确定 ”按钮 ， 完 成 记录 集 Rs2 的 绑 定 ， 把 绑 定 的 Rs2 中 的 字段 插入 个 人 
博客 页 面 日 记分 类 栏 中 的 适当 位 置 ， 如 图 8-88 所 示 。 
加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 表格 ， 如 图 
8-89 所 示 。 
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に エエ エエ エエ エエ エエ さて ささ ささ エエ エマ エエ エエ で エエ で さそ で そそ で そそ で さて エエ そそ で で で で さい 


图 8-88 ”插入 字段 图 8-89 选择 要 重复 的 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 一 次 可 以 显示 
的 记录 数 为 “所 有 记录 ” 如 图 8-90 所 示 。 


图 8-90 ”选择 一 次 可 以 显示 的 记录 为 “所 有 记录 ” 


单 击 “确定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 左 上 角 出 现 了 一 
个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

选中 编辑 页 面 中 的 Rs2.log class name 字段 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 服 
务 器 行为 ”标签 中 的 “+” 号 按钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ”选项 ， 在 打 
开 的 “ 转 到 详细 页 面 ”对 话 框 中 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 
中 的 log class.asp， 将 “传递 URL 参数 ”设置 为 log class ID， 设置 如 图 8-91 所 示 。 


第 8 章 人 于 :元 


链接 : | "< (Rs2. Fia1ds: Tem Lele w | 


详细 信息 幢 : /1og_class. asp 
传递 URL 参数 : 1og_c1ass_TD | 设置 为 以 下 项 的 
记录 集 : Rs2 op 
列 : cg Fl 
传递 现 有 参数 : | ] umr 参数 


| 表单 参数 


图 8-91 设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 完成 制作 。 接 看 制作 “最 新 回复 ”功能 ， 单 击 “ 应 用 程序 ” 
面板 中 的 “ 绑 定 ”标签 中 的 “+” 瑟 按钮 ， 在 打开 的 列表 有 亲 早 中 选择 “记录 集 ( 俘 询 )” 选 
项 ， 打 开 “ 记 录 集 ”对 话 框 ， 丫 击 “ 局 级 ”按钮 进入 “局 级 ”模式 ， 在 “局 级 ”模式 中 输入 
如 图 8-92 所 示 的 参数 。 


Es3| 
Em “| 


: SELECT top 5 
blog 1og.1og ID, blog log. user username, blog log.log addtime,log re 


ply. 
FROM blog 1og, log_reply 
WHERE blog log. user_username=’ MMuser’ And 


: 国 日 


表 格 添加 到 sgL: 


5 视图 
田 长 ”预存 过 程 ーー 


DFDER BY 


图 8-92” 绑 定 记 录 集 Rs3 


代 但 说 明 : 


SELECTblog log.log ID,blog log.user username,blog log.log addtime,log reply.* 

FROM blog log,log reply 

WHERE blog log.user_username デ MMuserAnd blog log.log ID=log reply.log ID 

/在 回复 表 没 有 所 从 属 的 主题 日 记 的 相关 信息 ， 用 条 件 blog log.log ID=log reply.log ID 来 获取 信 
忌 , 井 用 blog log.user username='MMuser' 来 限制 用 户 。 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs3 的 绑 定 ， 将 Rs3 记录 集中 的 reply_ttle 字 
段 插 入 到 “最 新 回复 ”栏目 中 ， 如 图 8-93 所 示 。 

选中 reply_title 字段 所在 的 表格 ， 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 堪 行 
为 ”标签 中 的 加 号 “+” 按 钮 。 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 一 
次 可 以 显示 的 记录 数 为 5, 如 較 8-94 所 示 。 


人 
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EE 


ーー 


图 8-93 搬入 reply ttle 字段 图 8-94 选择 一 次 可 以 显示 的 记录 数 
单 击 “确定 ” 投 钮 ， 完 成 设置 ， 再 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 


的 加 号 “+” 号 按钮 ， 在 打开 的 列表 菜单 中 选择 “记录 集 〈 碍 询 )” 和 选项， 打开 “记录 集 ” 对 
话 框 ， 具 体 参 数 设 置 如 图 8-95 所 示 。 


2 和 i ee 
ves = 辣 
列 : 他 全 部 〇 选 定 的 : 


]1 ご 
1s 


か 
ーー 
Us 


er blog name bd 
HF 二 


图 8-93 ” 绑 定 记录 集 Rs4 
单 击 “确定 ” 按 钮 ， 完 成 记录 集 Rs4 的 绑 定 ， 再 把 Rs4 记录 集中 的 
Rs4.user blog name 学 段 插入 人 到 “主题 ”说 明文 学 后 面 ， 完 成 后 的 效果 如 图 8-96 所 示 。 


DN 文件 07] 凌 作 GG) 吉普 (7) 手 入 (I) 情 弘 人 格式 名 合 和 を 6C) 站 点 全) 证 口 0 情動 OO | x 


ID casbioc sip calendar ess atyle css 
区 行 划 FT 人 人间 当 
< の [x 合同 站 9 1」 が ag fune at I 


动 老 文 池 (Rs ww eg es) 
生机 区 域 (BsS) 


Bx2.og < 
3 lsh letiud) 宣 暫 回 域 8s3) 
飼い 有 PE に + し) . ふ ず コ に 1 3 wpl t a 
3 (si Log_euntent) 雷 复 记 域 Qa) Sea 
动 者 净 趟 si joc.tstie) 
动态 文 志 Go enteaii 
动 者 文本 Ws】 or ndtine) 


hE sl fAirst recard) 
动 这 文本 Msl. isst record) 


v 时 了 EE 時)| 
“9o HR 
| 及 曙 卫 性， ， 上 用 本 于 有 上 


8-96 插入 user blog name 字段 


博客 系统 


8615 日 记分 类 内 容 页 面 


日记 分 类 内 容 页 面 用 于 显示 个 人 博客 日 记分 类 内 容 ， 页 面 设计 比较 简单 ， 效 果 如 图 8-97 


所 示 。 


Es chap081og_class.asp (KHTML)* a 


了 


关于 我 /新 闻 公堂 /我 的 好 上 友 / 最 近 访 客 / 最 新 评论 /最 新 贸 


已 


-| 
<body> <divimid> <div. content> 


|N 19 Q 100% v869 x 452v 266 /6 秒 简体 中 文 (GB2312) 


图 8-97 日 记分 类 内 容 效 果 图 


详细 制作 步骤 如 下 : 
创建 日 记分 类 内 容 的 静态 页 面 log_class.asp， 单 击 “ 应 用 程序 ”面板 中 “ 绑 


定 ” 标 签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 菜单 中 选择 “记录 和 集 (查询 )” 选 项 ， 打 开 “ 记 
录 集 ”对 话 框 ,，“ 记 录 集 ”对 话 框 中 的 参数 设置 如 图 8-98 所 示 。 


ーー 
表格 


列 :@) 全部 ( 逃 定 的 : 
luz TH 


SeL setIame 


lug class Ih 
loe title 
Jue addtime 


过 区 


8-98 ” 绑 定 记录 和 集 Rs 


单 击 “确定 ”按钮 ， 则 完成 对 记录 集 Rs 的 绑 定 ， 再 把 绑 定 的 记录 集 插入 到 网 
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页 的 相应 位 置 ， 如 图 8-99 所 示 。 


六 于 我 /新 闻 公 洁 / 我 的 好 上 友 / 最 近 坊 客 / 最 新 评 耸 / 最 新 留言 


图 8-99 ”插入 字段 到 网 页 中 
插入 字段 到 网 页 后 只 能 显示 一 条 记录 ， 而 系统 要 求 该 页 面 应 显示 所 有 或 部 分 记 
录 ， 所 以 要 加 入 “重复 区 域 ”设置 ， 单 击 要 重复 显示 的 表格 如 图 8-100 所 示 。 


eo eo en ee ee NN NNO NN Ol 
人 記 和光 記法 和光 和 和 光 0 語 和 計 和 i 
与 搞 小 : 区 } ” 漆 加 时 间 {Es.1 dd 】 


8-100 选择 要 重复 的 表格 


单 击 “应 用 程序 ”和 面板 群 组 中 的 “服务 占 行 为 ”标签 中 的 加 写 “+” 按 钮 。 在 
弹出 的 染 单 列表 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 一 次 可 以 显示 


的 记录 数 为 5， 如 图 8-101 所 示 。 


8-101 选择 一 次 可 以 显示 的 记录 数 为 $ 
单 击 “ 确 定 ” 投 钮 问 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 
将 鼠标 移 至 要 加 入 “记录 集 导 航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “ 数 
全 |， 在 打开 的 对 话 杠 中， 选取 要 导航 的 记录 集 以 及 导 


据 ” 标 签 中 的 “记录 集 导 航 条 ” 投 钮 号 |， 
航 条 的 显示 方式 ， 然 后 单 击 “ 确 定 ” 按 钮 回 到 编辑 负面 ， 如 图 8-102 所 示 。 


标 题 : {Rs.loe_title} 


8-102 ”插入 “记录 集 导 航 条 ” 


博客 系统 


选中 编辑 页 面 中 的 Rs.log title 学 段 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行 
为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 的 沫 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 
“ 转 到 详细 页 面 ” 对 话 框 中 单 击 “浏览 ”按钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 
log_content.asp， 将 “传递 URL 参数 ”设置 为 log_ID， 参 数 设置 如 网 8-103 所 示 。 


(Ri “loe titla 


详细 信息 页 ER DG ) 
传递 UEL 参 数 : 1og_II 设置 为 以 下 项 的 值 
记录 和 集 : IRs v| 
列 : log_ID マ 
飛 遂 現有 参 数 : | ] mL 参数 
[] 表单 参数 


8-103 ”设置 “ 转 到 详细 页 面 ” 对 话 框 
单 击 选 择 有 记录 时 要 显示 的 表格 ， 如 图 8-104 所 示 。 


: ee dR 此 过 候 如 采 罕 合 此 :如 采 符 合 i ; 
: 了 一 页 | : : : 斩 : 


8-104 选择 有 记录 时 要 显示 的 表格 


单 击 “应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 加 扎 “+” 按 钮 ， 在 弹出 
的 菜单 列表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 不 为 空 则 显示 区 域 ” 选 项 ， 打 开 “ 如 果 记 
录 集 不 为 空 则 显示 区 域 ” 对 话 框 ， 在 “记录 和 集 ”中 选择 Rs， 再 单 击 < 确定 ， 按钮 回 到 编辑 
页 面 ， 发 现 之 前 选中 要 显示 的 区 域 左 上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 …” 的 灰色 卷 
标 ， 这 表示 已 经 完成 议定 ， 设 置 及 效果 如 网 8-105 所 示 。 


训 素 全 对 上 入 让 为 空 则 显示 区 茂 


图 8-105 ”记录 和 集 不 为 空 则 显示 设置 及 效果 


人 
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选中 记录 集中 没有 数据 时 要 显示 的 文字 “目前 没 信 息 ”， 然 后 单 击 “ 应 用 程 
序 ” 面 板 中 的 “服务 喜 行 为 ”标签 中 的 加 号 “+” 按 钮 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 
为 空 则 显示 区 域 ” 选 项 ， 在 “记录 集 ” 中 选择 Rs， 再 单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 发 
现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 …” 的 灰色 郑 标 ， 这 
表示 已 经 完成 设 定 ， 效 果 如 图 8-106 所 示 。 


四 | D:Achap08\1log_class.asDp (XHTML) = ml, 


如果 符合 此 条 件 则 显示 ， 


目前 没有 任何 信息 


关于 我 /新 闻 公 洁 / 我 的 好 友 / 最 近 访 客 /最 新 评 伦 /最 新 留言 


< 
く body> <div#top> 


8-106 ”记录 集 为 空 时 显示 的 效果 


至 此 ， 日 记分 类 内 容 页 面 的 设计 与 制作 就 已 经 完成 了 。 


博 各 系统 后 台 设 计 


在 首页 index.asp 的 用 户 登 录 栏 中 ， 当 用 户 登 录 成 功 时 则 转 癌 check.asp， 当 用 户 登 录 
失败 时 则 转 到 errasp 页 面 。 一 般 用 户 只 可 能 对 目 己 的 日 记分 类 和 日 记 列 表 进 行 管理 ， 而 
管理 员 除 了 对 目 己 的 日 记 进 行 管 理 外 ， 还 可 以 对 用 户 信 息 、 用 户 日 记 和 博客 分 类 信息 进 
行 管 理 。 


月 上 管理 登录 身份 判断 


check.asp 页 面 通过 if 条件 判 断 语 句 对 转 过 来 的 用 户 名 字段 user_username 进行 判断 
是 不 是 admin， 如 果 是 再 转 癌 admin.asp， 如 果 不 是 则 转 同 user admin.asp， 话 细 制 作 步 又 
如 下 : 

用 户 成 功 登 录 后 转 到 check.asp 页 面 ，check.asp 页 面 比较 简单 ， 就 是 在 里 面 
加 入 一 段 下 条 件 判 断 语 句 和 绑 定 一 个 MM username 的 阶段 变量 ， 单 击 “ 应 用 程序 ”面板 
中 的 “ 绑 定 ”标签 中 的 加 号 “+” 授 钮 ， 在 打开 的 列表 有 末 早 中 选择 “阶段 变量 ”命令 ， 打 
开 “ 阶 段 变 量 ” 对 话 框 ， 在 打开 的 “阶段 变量 ”对 话 框 中 设置 其 名 称 为 MM_username， 如 


第 8 章 EE 客 系统 


8-107 所 示 。 


阶段 故里 


名称 : MN_us ername © | 


图 8-107 设置 阶段 变量 名 称 


单 击 “ 确 定 ” 按 钮 ， 完 成 阶段 变量 MM_username 的 绑 定 ， 再 单 击 代 码 视 图 按 


钮 | 弛 共 码 回 到 代码 编辑 视图 ， 向 里 面 加 入 一 段 让 条 件 判断 语句 ， 代 码 如 下 : 


<% 

if session("MM Username")="admin" then 

/ 判断 传递 过 来 和 变量 用 户 名 是 否 是 admin 
response.Rednrect( "admin.asp") 

/ 如 果 是 admin 则 转向 admin.asp 

else 


response.Redirect("user admin.asp") 
/ 否则 转向 user admin.asp 

end 1f 

00>> 


用 户 在 index.asp 首页 中 登录 失败 则 转 癌 失败 页 面 errasp, errasp 是 提示 用 户 登 
孙 失 败 再 重新 登录 的 一 个 页 面 ， 效 末 如 网 8-108 所 示 。 


Ts ni tchap08terr.asp [YHTML) -口交 


您 没有 注册 或 填写 错误 ， 请 重新 登录 ! | 


[TS x 138x 1 KE 1 秘 简体 中 训 GEg31gi 


图 8-108 ”登录 失败 页 面 


在 登录 失败 页 面 errasp 中 有 两 个 链接 ， 一 个 是 没有 注册 时 单 击 文学 “注册 ” 
链接 到 注册 页 耐 registerasp《〈 用 户 注册 介绍 ， 本 童 将 不 再 说 明 )， 态 外 一 个 是 填 号 错误 时 单 击 
文字 “和 登录” 则 返回 到 首页 ， 用 户 可 重新 登录 。 


8.42 管理 主页 面 功 能 ) 


- 般 用 户 后 台 管 理 页 面 用 于 用 户 登 录 成 功 后 ， 通 过 该 页 面 可 以 对 自己 的 注册 资料 进行 修 
改 ， 同 时 还 可 以 对 目 己 的 日 记分 类 和 日 记 列 表 进 行 修 改 、 删 除 和 添加 等 操作 。 静 态 页 面 的 设 
计 效 果 如 图 8-109 所 示 。 
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で ni い chap08tnsex_admin.asp (KHTML)* = aly, 


EH connblog. asp style.css 〒 


蝎子 博客 


ニー ニニ ニー ニー ニー ニー ニニ ニー ニニ ニー ニニ ニニ ニニ ニー ニニ ニニ ニニ ニー ニー ニー こつ) 5 


您 好 : 1 用 尸 信息 资料 : 


天 于 我 中 [ 阁 公告 /我 的 好 点 /最 近 访 客 /最 新 评 亿 / 最 新 鲁 言 


E-mail: jambo@l26.com 


《 国 
body> <divimid> <div. content> [RI 869 x 452v 257 K/ 6 秒 简体 中 文 (582312)  .: 


8-109 一 般 用 户 后 人 台 管 理 页 面 效果 


制作 步骤 如 下 : 
在 user admin.asp 页 面 设计 中 表单 froml 中 的 文本 域 和 文本 区 域 设 置 见 
表 8-3。 


表 8-3 表单 ffom1 中 的 文本 域 和 文本 区 域 设置 


意 义 文 本 (区) 域 /按钮 名 称 类 型 
用 户 名 user username 单行 
用 户 密码 user password 单行 
博客 名 称 user blog name 单行 
用 户 邮 箱 user email 单行 
所 属 分 类 typename 列表 / 沫 单 
修改 Submit 提交 按钮 
取消 Submit2 重 设 按钮 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 “+” 按 钮 ， 在 打开 的 列表 荣 单 
中 选择 “阶段 变量 ”命令 ， 打 开 “ 阶 段 变量 ”对 话 框 ， 设 置 名 称 为 MM username， 设 置 如 
图 8-110 所 示 。 


陈 段 悉 里 


る 秋 


8-110 设置 阶段 变量 MM username 


将 绑 定 的 阶段 变量 插入 到 网 页 user admin.asp 中 ， 如 图 8-111 所 示 。 


关于 我 /新 闻 公 告 / 我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 AL1 Rights Reseryed 


E-mail jamboBdle6, com 


8-111 插入 阶段 变量 MM username 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ” 标 签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 (查询 )” 选项， 打开 “记录 集 ” 对 话 框 ， 参 数 设置 如 图 8-112 所 示 。 


User ILI 
typename 

SE SerTLAMme 
se ass or 
User blog Tame 


请 选 : User LBT TLITI 


阶段 变量 = MM username 


8-112 绑 定 记录 集 rs user 


单 击 “确定 ”按钮 ， 完 成 记录 集 rs user 的 绑 定 ， 把 绑 定 的 rs user 中 的 字段 插 
入 网 页 的 合适 位 置 ， 如 图 8-113 所 示 。 


用 户 信息 资料 : : 
+ 
: 
! 
> 
) 
1 
1 


8-113 ” 绑 定 字段 
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在 “上 所属 分 类 ”一 位 中 需要 动态 绑 定 所 有 的 博客 分 关 ， 单 击 “ 应 用 程序 ” 
面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 荣 单 中 选择 “记录 集 〈 得 
询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 共 体 参 数 设 置 如 网 8-114 所 示 。 


名 称 : 回 
连接: | conmblog 
表格 : blog_type 


列 : @ 全部 〇 选 定 的 : 


图 8-114” 绑 定 记录 和 集 Rs 


单 击 选 择 type_name 列表 / 沫 单 ， 在 “属性 ”面板 中 选择 动态 按钮 区 动 世 .| 
打开 “动态 列表 / 染 单 ”对 话 框 ， 在 打开 的 “动态 列表 / 深 单 ”对 话 框 中 设置 “来 目 记录 集 的 
选项 ”为 Rs,“ 值 ”和 “标签 ”都 为 typename， 再 单 击 “ 选 取 值 等 于 ”后 面 的 加 图 标 ， 打 开 
“动态 数据 ”对 话 框 ， 在 打开 的 “动态 数据 ”对 话 框 中 选择 “ 域 ” 为 rs user 记录 集中 的 
typename 字段 ， 然 后 单 击 “ 确 定 ” 投 钮 回 到 “动态 列表 / 菜 和 单 ”对 话 框 ， 再 次 单 击 “ 确 定 ” 
按钮 完成 动态 数据 的 绑 定 。 设 置 如 图 8-115 所 示 。 


动态 列表 7 深 单 


EEE 
ser ID 取消 


: | typeruame 


: | typename w 


: = (rs user. Pields. Iten (“typenar 


BD: 人 = lrs user Fialds.Tten ("typene 


图 8-115 动态 数据 的 绑 定 
完成 记录 集 的 绑 定 后 ， 单 击 “ 服 务 喜 行 为 ”面板 中 的 加 号 “+” 按 钮 ， 从 打开 
的 荣 单 中 选择 “更 新 记录 ”命令 ， 为 网 页 添加 “更 新 记录 ”的 服务 需 行 为 。 
此 时 ， 将 打开 “更 新 记录 ”对 话 框 ， 在 对 话 框 中 输入 如 图 8-116 所 示 的 参数 。 


EE 六:; 夸 瑞 让 博客 系统 


-be 定义 


要 更 新 的 表格 : Users Ea 
选 职 记录 上 自 : 5 Ser vy 
唯一 键 列 : | user_ID v| 加 数值 

在 更 新 后 ， 转 到 : jaser_adnin. ss | [WE 


获取 值 自 :| form1 ™ | ( 提 宙 時 
表单 元 素 : es sername 更 新 列 "user us i 
se。 中 Ce 区 本 ) 
mai 更新 区 es 
i name 電導 し name 7 区 本 


到 |: | User Username be 


提交 为 : | 文本 可 


图 8-116 “更 新 记录 ”对 话 框 设置 


单 击 “ 确 定 ” 按 钮 ， 完 成 更 新 记录 的 设置 。 用 户 可 以 单 击 “ 个 人 主页 ”进入 
用 户 个 人 的 博客 主页 面 ， 首 先 选 中 编辑 页 面 中 的 “个 人 主页 ”文学 ， 再 单 击 “应 用 程序 ” 
面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 ; 在 弹出 的 订单 列表 中 选择 “ 转 到 详细 
页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ” 
对 话 框 ， 选 择 此 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 为 user_username， 设 置 如 图 
8-117 所 示 。 


链接 : | * 个 人 主页 ” 。 罰 
详细 信息 页 user.asp 1 加 上 .|] 


传递 URL 参数 : user_nsernane | 设置 为 以 下 项 的 值 


传递 现 有 务 煞 : | | IRL 佑 娄 
| | 表单 参数 


图 8-117 设置 “ 转 到 详细 页 面 ” 对 话 框 


早 击 编辑 页 面 中 的 文学 “博客 主页 ”在 属性 面板 中 选择 “链接 ”文本 框 后 面 
的 浏览 文件 按钮 名， 打开 “选择 文件 ”对 话 框 ， 选 择 同一 站 点 中 的 首页 文件 index.asp。 

user admin.asp 页 面 还 要 为 用 户 提 供 链接 到 编辑 页 面 的 链接 ， 对 目 己 的 博客 
记 和 日 记分 类 的 添 加 、 修 改 和 删除 功能 ， 因 此 要 设 定 转 到 详细 页 面 功 能 ， hm 

能 够 根据 参数 值 从 数据 库 中 将 茶 一 条 数据 科 选 出 来 进行 编辑 。 单 击 页 面 中 的 “日 记分 其 管 

理 ” 文 学 然后 单 击 “ 服 务 器 行为 ”面板 中 的 加 写 “+” 按 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详 
细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 杠 中， 在 “详细 信息 页 ”文本 框 中 输入 
admin log type.asp， 将 “传递 URL 参数 ”设置 为 记录 集 rs user 中 的 user username 字段， 
如 图 8-118 所 示 。 
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详细 信息 页 : |admin log type asp ーー 


传递 URL 参 数 : luser_username | 设置 涯 以 下 项 的 值 


记录 集 9 r Ss_us er 


传递 现 有 参数 : [ ] mr 参数 
し | 表单 参数 


图 8-118 设置 “ 转 到 详细 页 向 ”对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 选 中 编辑 页 面 中 “日 记 列表 管理 ”文字 然后 
单 击 “ 服 务 右 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 评 细 页 面 ”， 选 
项 ， 打 开 “ 转 到 详细 页 面 ” 对 话 框 。 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 
admin log _ class.asp， 将 “传递 URL 参数 ”设置 为 记录 和 集 rs user 中 的 user ID 字 段 , 其他 疫 
定 值 给 不 改变 其 默认 值 ， 如 图 8-119 所 示 。 


传递 URL 参数 : nser_TD | 设置 为 以 下 项 的 值 
记录 集 : rs_user yi 

user TD 回 
传递 现 有 参数 : 站 ypL 参数 
口 ] 表单 参数 


图 8-119 设置 “ 转 到 详细 页 面 ” 对 话 框 
选中 编辑 页 面 中 的 “注销 用 户 ” 文 字 ， 给 用 户 添加 一 个 注销 功能 ， 单 击 “ 应 
用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按钮 ， 在 弹出 的 菜单 列表 中 选择 “用 
户 身份 验证 /注销 用 户 ”选项 ， 在 “在 完成 后 ， 转 到 ”文中 框 中 输入 index.asp， 如 图 8-120 
所 示 。 


在 以 下 情况 下 注销 : Q | 单 击 链接 : | 


esse 2 


在 完成 后 ， 转 到 : |index. asp 


图 8-120 设置 “注销 用 户 ” 对 话 框 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 。 因 为 个 人 日 记 管 理 页 面 user admin.asp 是 通 
过 用 户 用 户 名 和 和 密码 进入 的 ， 所 以 不 希望 其 他 用 户 进 入 ， 这 就 需要 设置 用 户 的 权限 。 早 击 
“应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 号 “+” 投 钮 ， 在 弹出 的 染 单 列表 中 选择 
“用 户 喘 份 验证 /限制 对 页 的 访问 ”选项 ， 在 打开 的 “限制 对 页 的 访问 ”对 话 框 中 设置 “如 果 
访问 被 拒绝 ， 则 转 到 ”index.asp 页 面 ， 如 图 8-121 所 示 。 


基于 以 下 内 容 进 行 限制 : (や 。 用 户 名 和 密码 
〇 ”用 户 和 名、 密码 和 访问 级 别 


ーー 


如 果 访问 被 拒绝 ， 则 转 到 |: 


8-121 设置 “限制 对 页 的 访问 ”对 话 框 


早 击 “ 俏 定 ”按钮 则 完成 了 个 人 日 记 后 台 管 理 页 面 user admin.asp 的 制作 。 整 
体 页 面 设计 效 果 如 图 8-122 所 示 。 


ap sis ass UPT) -Dx 
CAD ceanbleg sp style err 7 


用 户 稍 息 尘 料 ; 


| 用 » 
| Give [MIO Too me 52v 18 E70 重体 申立 iz3iz) 


图 8-122 ”整体 页 面 设计 效果 图 
管理 员 后 台 管 理 页 耐 admin.asp 的 制作 与 个 人 博客 后 人 台 管 
同 ， 只 是 加 了 两 个 页 面 的 链接 ， 页 面 链接 如 下 : 
@ “博客 分 类 管理 ”链接 的 页 面 为 adtmin_ blog type.asp: 
@ “博客 列表 管理 ”链接 的 页 面 为 admin blog.asp。 
完成 的 效果 如 图 8-123 所 示 。 


Ep: echt is ssp (KFT) = 


个 
咽 
ヤ 
泊 
Ey 
Da 
コロ 
に 
> ト 
TT 


D 
ody) [Re Om v 261 下 /5 驳 | 精 伟 中 廊 (o82312) | 


8-123 管理 员 后 台 管 理 页 面 效果 图 
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:日 记分 类 管理 页 面 


日 记分 类 管理 页 面 admin log type.asp 是 个 人 日 记 后 台 管 理 主 页 面 通过 字段 user 
username 转 到 的 一 个 管理 页 面 ， 这 个 页 面 主要 为 用 户 提 供 添加 日 记分 类 和 链接 到 修改 、 删 除 
日 记分 类 的 功能 。 静 态 页 面 的 设计 效果 如 图 8-124 所 示 。 


ni い chapo8tadmin_1og_type.asp (XHTNL)* -Ox 


cormublog.asp style.css 


蝎子 博客 


; 添加 日 记分 类 : 


关于 我 /新 闻 公 告 /我 的 好 点 /最 近 访 客 /最 新 评论 /最 新 留言 


中 
<body> <div#top> <div#banner> <div. banner > WI9 869 x 452v 254K ア BE 秘 简体 中 次 (G6B2312)  .; 


图 8-124 静态 页 面 的 设计 效果 


制作 步骤 如 下 : 

创建 该 页 面 的 静态 效果 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 
“+” 按 钮 ， 在 打开 的 列表 荣 单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 和 集 ” 对 话 框 ， 具 
体 参 数 设 置 如 图 8-125 所 示 。 


名 称 : 
表格 
列 : 外 全部 し) 选 定 的 : 


luz elass: TH 


SeL ロロ TFTLBIT 選 


loe elass: Tame 
lug class Tnnm 


生計 ser msernanme = VF ーー 
于 
类 序 | 无 == 图 由 和 


8-125 ” 绑 定 记录 集 Rs 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs 的 绑 定 ， 把 绑 定 的 记录 集 Rs 中 的 字段 


过 :二 项 沁 博客 系统 


log class name 插入 到 网 页 的 适当 位 置 ， 如 图 8-126 所 示 。 


も 


= 
人 


图 8-126 插入 log class name 字段 


由 于 admin log type.asp 页 面 应 显示 数据 表 log type 中 的 所 有 记录 ， 而 目前 的 
设 定 只 能 显示 数据 库 的 第 一 条 数据 ， 因 此 ， 需 要 加 入 “服务 右 行 为 ”中 “重复 区 域 ” 设 定 ， 
单 击 admin log type.asp 页 面 中 的 表格 ， 如 图 8-127 所 示 。 


修改 删除 
图 8-127 选择 要 重复 显示 的 记录 和 集 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“+? 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 “重复 
区 域 ”对 话 框 中 ， 设 定 一 次 可 以 显示 的 记录 数 为 “所 有 记录 ”设置 如 图 8-128 所 示 。 


图 8-128 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ” 鬼 钮 回 到 编辑 页 面 ， 友 现 之 前 选中 要 重复 的 区 域 的 元 上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

接 下 来 加 入 显示 区 域 的 设 定 。 如 果 数 据 库 中 有 效 据 希 望 显示 数据 。 首 先 选 取 记 
录 集 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-129 所 示 。 


Rs.1ng class name} 


图 8-129 选择 要 显示 的 表格 


单 击 “应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 号 “+” 投 钮 ， 在 弹 
出 的 亲 单 列表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 来 记录 集 不 为 空 则 显示 区 域 ”选项 ， 打 开 “ 如 
条 记录 集 不 为 空 则 显示 区 域 ” 对 话 框 ， 在 “记录 集 ” 中 选择 Rs， 再 单 击 “ 确 定 ” 按 钮 回 到 
编辑 页 面 ， 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 .…” 
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的 灰色 大 标 ， 这 表示 已 经 完成 设 趾 ， 设 置 及 效果 如 图 8-130 所 示 。 
如果 记 录 集 不 为 空 则 显示 区 域 


图 8-130 ”记录 集 不 为 空 则 显示 的 区 域 


选中 记录 集 没 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-131 所 示 。 


大 日 记分 类 


图 8-131 选择 没有 的 数据 时 显示 的 区 域 


单 击 “ 应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 写 “+” 控 钮 ， 在 弹 
出 的 六 日 列表 中 ， 选 择 “ 显 示 区 域 ”一 “如 果 记 录 集 为 宇 则 显示 区 域 ”选项 ， 打 开 “ 如 
条 记录 集 为 空 则 显示 区 域 ” 对 话 框 ， 在 “记录 集 ” 中 选择 Rs， 青 单 击 “确定 ”按钮 问 到 
编辑 页 面 ， 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 .…” 
的 灰色 友 标 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 图 8-132 所 示 。 


襄 采 记录 集 为 空 则 显示 区 城 


记录 条， 


名 音符 客席 案 御 测评 寺 ， 


图 8-132 ”记录 集 为 宇 则 显示 区 域 


下 面 将 制作 添加 日 记分 类 ， 首 先 插入 一 个 隐藏 区域， 然后 将 绑 定 面板 中 
的 Session 变量 MM username 绑 定 到 表单 中 的 user username 隙 滅 域 中 , 如 関 8-133 
所 示 。 
at 


区 隊 裕 区 域 
mser_usernam 価 W) <%= Session("MM_username") %> | 多 


图 8-133 ” 绑 定 字段 到 隐藏 域 中 


学 :证 天 到 博客 系统 


单 击 “ 应 用 程序 ”面板 中 “服务 亏 行 为 ”标签 中 的 加 号 “+” 投 钮 。 在 弹出 
的 订单 列表 中 ， 选 择 “ 插 入 记录 ”选项 ， 在 “插入 记录 ”对 话 框 中 按 如 图 8-134 所 示人 设置 


| 


获取 值 自 : | fornl | (在 提 变 时 ) 


lo celass nam s 插 尺 .到 列 | 中 "og et 立 本 ] 
下 時 中 


user userIamej 庆 六 到 | 旨 中 "uasar userrame” 忆 


列 | : log_class_ name v 
提交 为 : 立 本 | 


图 8-134 ” 设 定 “插入 记录 ”对 话 框 


单 击 “ 人 确定” 按钮 完成 记录 的 搬入， 选择 表单 执行 末 单 栏 中 的 “窗口 ”一 “ 行 
为 ”命令 ， 打 开 “ 服 务 器 行为 ”面板 ， 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 打 
开 的 行为 列表 中 ， 选 择 “ 检 得 表单 ” 打开 “ 检 答 表单 ”对 话 框 ， 设 置 log_class_name 文 本 
域 的 值 都 为 “必需 的 ” 可 接受 “任何 东西 ” 设置 如 网 8-135 所 示 。 


可 控 爱 : 外 性 何 东 西 〇 数 宇 
〇 电子 邮件 地 址 〇 ) 数字 从 | | 到 | | 


图 8-135 设置 “检查 表单 ”对 话 框 


页 面 编辑 中 的 文学 “修改 ”和 “删除 ”的 链接 ， 必 须 给 要 转 到 的 页 面 传递 参 
数 ， 这 样 前 往 的 页 面 才 能 够 根据 参数 值 从 数据 库 中 将 茶 一 条 数据 饶 选 出 来 进行 编辑 。 选 中 编 
辑 页 面 中 的 “修改 ”文字 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 选 
择 “ 转 到 详细 页 面 ”选项 ， 在 打开 “ 转 到 详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ”按钮 ， 打 开 “ 选 
择 文件 ”对 话 框 ， 选 择 admin log typeupd.asp， 将 “传递 URL 参数 ”设置 为 记录 集 Rs 中 的 
log class_ ID 学 段 ， 其 他 设置 保持 默认 值 ， 如 网 8-136 所 示 。 


链接 : “ 传 改 " マ 
详细 信息 页 
传递 VEL 参数 : 设置 为 以 下 项 的 值 
A 
選好 現有 参 数 : | ] umr 参数 
[| 表单 参数 


8-136 ”设置 “ 转 到 详细 页 面 ” 对 话 框 


选中 “删除 ”文学 并 重复 上 和 面 的 操作 ， 将 要 转 到 的 详细 页 面 改 为 admin log _ 
typedel.asp， 如 图 8-137 所 示 。 


转 到 详细 页 面 
ビ 可 
译 旨 信 息 页 [sanin loe tpeael sp = = La | 
传递 URL 参 数 : 设置 为 以 下 项 的 值 ES 
记录 入 zz 国 
列 : 
传递 现 有 参数 : [ ] umr 参数 
口 表单 参数 


8-137 设置“ 转 到 详细 页 面 ” 对 话 框 
单 击 “ 确 定 ” 按 钮 ， 完 成 日 记分 类 管理 页 面 admm log type.asp 的 制作 ， 效 果 
如 图 8-138 所 示 。 


で D:vchap0svadnin_ log_type.asp CGHTML) - 口 X 


HR connblog. asp style. css 


蝎子 博 品 


: 添加 日 记分 类 : 


关于 我 /新 闻 公 上 /我 的 好 友 / 景 近 访 客 /最 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 如 1 Rights Reserved 


E-mail: jambold12B. com 


< 
人 body> <div#top? RQ 869 x 452v 264 K/ 5 秒 簡体 中 文 (GB2312)  : 


8-138 ”日 记分 类 管理 页 面 效果 


博客 系统 


4 


> 于 修改 日 记分 类 页 面 


接 下 来 要 设计 修改 日 记分 类 的 页 面 admin_log_typeupd.asp， 这 个 页 面 的 主要 功能 是 将 数 (>) 


据 表 中 的 数据 传送 到 页 面 的 表单 中 进行 修改 ， 修 改 数 据 后 再 更 新 到 数据 表 中 ， 页 面 设 计 如 图 
8-139 所 示 。 


pichapostadmin_1og_typaupd.asp (XHTL)* - x 


蝎子 博 品 


000 您 好 


关于 我 / 靳 闻 公 洁 / 我 的 好 友 / 最 近 坊 客 / 最 新 评论 /最 新 留言 


< > 
ody> Ca mi dy く diy. eontent> く form ま form1> 871 x 439v 252K ア BE 秘 簡体 中 立 (GB2312) os 
8-139 ”修改 日 记分 类 页 面 设计 


操作 步骤 如 下 : 

创建 admin log typeupd.asp 页 面 ， 并 单 击 “ 绑 定 ” 和 面板 中 的 加 亏 “+” 投 钮 ， 
在 弹出 的 选项 中 ， 选 择 “ 记 录 集 ( 合 询 )” 选 项 ， 打 开 “ 记 录 集 ” 对 话 框 蛙 击 “局 级 ” 控 钮 
进入 融 级 模式 窗口 ， 在 “记录 集 ” 对 话 框 中 输入 参数 如 图 8-140 所 示 ， 单 击 “确定 ” 投 钮 完 
成 议定 。 


名 称 : 转 
Er 


SQL: SELECT * | 
FROM log type 
WHERE log_class ID = MMColFaram and user username=’ muser’ 


参数 : +| [二 | 


i MMColF ar am 


QueryString("1 

5 t. trinel” So 
県 Reqnes ueryString ("log_ 
编辑 ... 


类 ”预存 过 程 


OFDER BY 


8-140” 设 定 Rs“ 记 录 集 ”对 话 框 


语法 说 明 : 


这 里 增加 了 MMColParam 和 muser 两 个 变量 ， 设 置 运行 值 分 别 为 session("MM username") 和 
Request.OueryString("log _ class ID?), 
SELECT * 


FROM log type 
WHERE log class ID = MMColParam and user username= muser 


/此 段 的 意思 为 根据 log class ID = MMColParam and user username='muser' 条 件 选 择 log type 数据 
表 中 所 有 的 字段 。 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 admin log typeupd.asp 网 页 的 适当 位 
曾 ， 如 图 8-141 所 示 。 


蜗 プ 博 = 风月 的 轮回 。 永 恒 的 记忆 1! 


Ri 你 好 


关于 我 /新 闻 公告 /我 的 好 友 / 最 近 访客 / 晤 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 AL1 Rights Reserve 


E-mail! jambofBled, com 


8-141 字段 的 搬入 


完成 表单 的 布 阐 后 ， 要 在 admin log typeupd.asp 页 面 中 加 入 “服务 需 行 为 ”中 
“更 新 记录 ”的 设 定 ， 在 admm log typeupd.asp 页 面 中 ， 单 击 “应 用 程序 ”面板 中 的 “服务 
右 行 为 ”标签 中 的 加 号 “+” 按 钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “ 更 新 记录 ”选项 ， 打 开 
“更 新 记录 ”对 话 框 ， 其 体 参数 设置 如 网 8-142 所 示 。 


Econnbloe 
i 
选 职 记录 自 : | Rs 
唯一 畠 列 : 数值 
在 更 新 后 ， 转 到 


获取 值 自 : = 一 nl 状 | (可 朗 时 ) 
表单 元 素 : 


an 
提 变 洲 : | 文本 の 


8-142 ”设置 “更 狐 记录 ”对 话 框 


单 击 “ 确 定 ” 投 钮 回 到 编辑 页 面 ， 守 成 修改 日 记分 类 页 面 的 设计 ， 完 成 后 的 效 
果 如 图 8 8-143 所 示 。 


四 n:tchap08tadmin 1og_ typeupd.asp (XHTML) 


HA conmb1og.asp style. css 


喝 プ 二宮 


:Rs. user_username} 您 好 


关于 我 /新 闻 公 告 /我 的 好 皮 / 晴 近 访客 /最 新 评论 /最 新 留言 
他 一 一 一 一 = = ミク 
body> <div#top? [JR 871 x 439v| 257 K / 6 秒 | 简体 中 文 (582312) | 


图 8-143 ”完成 后 的 页 面 效果 


:和 删除 日 记分 类 页 面 


设计 删除 分 类 的 页 面 admin log typedelasp， 此 页 面 设计 和 修改 的 页 面 差 不 多 ， 如 网 
8-144 所 示 。 其 方法 是 将 表单 中 的 数据 从 站 点 的 数据 表 中 删除 。 


中 | D:Achap08admirn_ 1og_typedel.asp (XHTHL)* 


ENR connblog. asp style.css 


NOOOCXX 您 好 


关于 我 /新 闻 公 洁 / 我 的 好 友 / 最 近 访 客 / 最 新 评 众 / 最 新 久 


正吾 


< | 


ody> Ca hi dy く diy. content> く form#Eorm1> | IR | 9 a 100% ~ 


8-144 ”删除 页 面 的 设计 


详细 制作 步骤 如 下 : 


创建 admin_log typedel.asp 页 面 ， 并 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 投 钮 ， 在 


弹出 的 选项 中 ， 选 择 “ 记 录 集 (人 查询)” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 参 数 设 置 如 图 8-145 
所 示 。 


3 


lue class 11 
Ser SerILam 所 
lug class rame 
loe class Tumnm 


| 
お | 
| 


8-143 ” 设 定 “记录 和 集 ” 对 话 框 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 admin log typedelasp 网 页 的 适当 位 


置 ， 如 图 8-146 所 示 。 


由 子 博 放 风月 的 轮回 。 永 恒 的 记忆 1! 


dh 


关于 我 /新 闻 公 省 /我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 AL Rights Reseryed 


E-mail: jambofil1Z8.:com 


8-146 字段 的 插入 


搬入 一 个 隐 韦 区域， 然后 将 绑 定 面板 中 的 log class ID 绑 定 到 表单 中 的 


log class ID 隐藏 域 中 ， 如 图 8-147 所 示 。 


II 陷 凉 区 域 
Leelass TH 人 [ERs Fialds Tton (lag cassml 人 
绑 定 字段 到 隐藏 域 中 


8-147 
“删除 记录 ”的 设 定 ， 在 admin log typedel. 三 页 面 中 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 


完成 表单 的 布置 后 ， 要 在 admin log typedel.asp 页 面 中 加 入 “服务 器 行为 ”中 
中 的 加 号 “+” 按 钮 。 在 弹出 的 保单 列表 中 ， 选 择 “ 删 除 记 录 ” 选 项 ， 在 打开 


| な ゴミ 人 
的 “删除 记录 ”对 话 杠 中， 输入 如 图 8-148 所 示 的 参 数 。 


器 行为 ”标签 
从 表格 中 删除 : 
选 了 记录 自 : | 
= 昌久 eu:m 可 
a 


提 充 此 表单 以 册 除 : fornl ~ 
册 隆 后 ， 转 到 | : 
1 面 的 设计 ， 如 图 8-149 


图 8-148 议定 “删除 记录 ”对 话 框 


单 击 “确定 ”按钮 回 到 编辑 负面 ， 完 成 如 除 日 记分 


所 示 O 
窟 。 ni い chap08tadmin_1og_typede1 asp 〔YHTWL) 
HR connblog. asp style. css 


蝎子 博 吕 


{Rs. user_username} 您 好 


I00-2008 ne pe i Rights Reserved 
mbola12B. com 


a] 
| 
1K71l 秒 简体 中 文 (662312) 


天 于 我 /新 闻 公 告 / 臣 的 好 点 /最近 访客 /最 新 评论/ 县 新 鱼 言 


完成 的 设计 效果 


8-149 


く 
< く body> <div#top> 


人 
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清唱 日 记 列表 管理 主页 面 


日 记 列 表 管 理 主 页 面 admin log class.asp 的 主要 功能 是 显示 所 有 上 日记， 并 通过 该 页 面 进 
入 到 日 记 修改 admin log classupd.asp 页 面 和 日 记 删 除 admin log classdel.asp 页 面 ， 而 且 还 
有 添加 日 记 的 功能 。 页 面 设计 效 末 如 图 8-150 所 示 。 


中 | D:Achap08admin_ 1og class.asp (XHTHL)* 


蝎子 博客 


日 记 列表 管理 : 


提交 | | 重 置 | 


TT 


< 而 | > 
<body> <diymid> <div. content1> kGQ 100% y8Tlx5lTy268K/B 秒 筒 体 中 文 (GB2312)  .: 


8-1S0 日 记 列 表 管 理 页 面 效果 图 


制作 步骤 如 下 : 
创建 该 页 面 的 静态 效 朱 ， 单 击 “ 绑 定 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选项 
中 ， 选 择 “ 记 录 集 (会 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 并 早 击 “局 级 ”按钮 进入 局 级 模式 


窗口 ， 打 开 “ 记 录 集 ”对 话 框 中 按 如 图 8-151 所 示 输 入 参数 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 。 


和 
连接 : | cennblog 


FROM bloe 1og,1og_type 

WHERE blog log. user username=’ muser hnd 
1og_type.1og_ class TI=blog 1og.1og class_Il 
DRDER BY blog 1og.1og TI DESC 


添加 到 SaL: 


WHERE 


URIER BY 


类 ”预存 过 程 


8-1S1 设 定 Rs“ 记录 集 ” 对 话 框 


过 :二 项 沁 博客 系统 


语法 说 明 : 
SELECT blog log.*,log type.log class ID,log type.log class name 
FROM blog log,log type 
WHEREblog log.user username='muser'And log type.log class ID=blog log.log class ID ©) 
ORDER BY blog log.log ID DESC a 


/通过 blog log.user username='muser'And log type.log class ID=blog log.log class ID 条件 , 投 
blog log.log ID 降序 条 件 ， 从 blog log 和 log type 两 个 数据 表 中 选择 出 相应 的 字段 。 


绑 定 记录 后 ， 将 log title 字段 和 log class name 字段 插入 到 网 页 的 适当 位 置 ， 
如 图 8-152 所 示 。 


Es: ge m 
[三 
イイ スス イス TTY テッ スイ リエ ッッ きけ イエ テイ チャ エイ イサ イイ イイ サイ スー ナイ スス テス イイ イト トイ 
标题 日 记分 类 管理 
CC RR DO ENA NE 
| 、 
A . » 
: : 
Rs.1og title} : {Rs. 1og_class_name}】 鞭 改 删 际 

: に 


EE SS NO SS i OS a a oe i oe oO A EE i OR FO EA OE Oe a A a A a a or 


こそ そそ そそ そそ そそ すそ すそ そそ そそ そそ そそ て そそ すそ て で そそ て すそ そそ そそ で すそ すそ そそ そそ そそ そそ そそ て そそ て そそ そそ そそ すそ て そそ そそ すそ そそ て そそ て そそ て そ そそ そそ て て て そそ そそ そそ そそ て すそ すそ て そそ そそ そそ そそ て そそ て そそ て そそ て そそ て そそ て そそ すそ そそ で て そそ で 1 


图 8-152 插入 字段 
由 于 admm log class.asp 页 面 用 于 显示 所 有 用 户 日 记 列 表 的 记录 ， 而 目前 的 设 
定 只 能 显示 数据 库 的 第 一 条 数据 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 
单 击 admin log class.asp 页 面 中 要 重复 显示 的 表格 ， 如 图 8-153 所 示 。 


に も も も も も も も も も も も も も も もせ も も も も モモ モミ モミ モト トミ モミ モモ トモ セト ミミ モモ エキ キト モ ミエ トモ トト キミ キモ ミセ モモ ミエ トモ エモ キセキ エモ ミミ トモ トモ ミミ トミ トモ トモ トミ ミミ トト キ トミ ミミ エモ トモ セト トミ ミキ モモ トト キミ モミ トモ トキ ミセ モモ モト を 


和 


图 8-153 ”选择 要 重复 显示 的 表格 
单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 载 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“+?” 按 钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 “重复 
区 域 ” 对 话 框 中 ， 设 定 一 次 显示 的 记录 数 为 “所 有 记录 ” 如 图 8-154 所 示 。 


图 8-154 选择 要 重复 显示 记录 集 的 数目 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 耐 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

依照 记录 集 有 的 状况 或 条 件 来 判别 是 人 否 要 显示 网 页 中 的 条 些 区 域 ， 这 束 古 显示 区 
域 的 设 定 ， 首 先 选 中 记录 集 有 数据 时 要 显示 的 数据 表格 ， 如 疼 8-155 所 示 。 


列表 管 = 
和 


人 标 ”是 日 证 分 类 : 管理 


| s. long title} 8 {Es. lng class name} 狠 改 删除 


图 8-155 选择 有 数据 时 要 显示 的 数据 


-二 
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单 击 “ 应 用 程序 ”面板 中 的 “服务 喜 行 为 ”标签 中 的 “+” 亏 按钮 ， 在 弹出 的 
末 单 列表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 不 为 空 则 显示 区 域 ”选项 ， 打 开 “ 如 果 记 录 
集 不 为 宇 则 显示 区 域 ” 对 话 框 ， 在 “记录 集 ” 中 选择 “Rs” 再 单 击 “ 确 定 ” 投 钮 加 到 编辑 页 
面 ， 将 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 …” 的 灰色 
卷 标 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 几 8-156 所 示 。 


邓 来 全 承 集 趟 为 空 则 坚 示 区 茂 


网 子 丰 车 ,5 轮回 。 永 恒 的 记忆 ! 


和 


重視 标 大 : 日 记分 类 : 管理 


Rs. lag tit]ai 5 {Rs. loe class namel 瘀 改 删 除 


St Es 


8-156 ”记录 集 不 为 空 则 显示 


选中 记录 集 没 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-157 所 示 。 


目前 无 日 记 ， 博 弯 加 日 记 ， 


ピュ ニン ニョ ョ ッ ルン ーー ニョ ニョ スン l ョ ーー ニョ ンー ニョ ンー ニョ エー ニョ イニ ョ bl Bee ete Bee alle Be Se Bee Pana Bee mln Bee ee Bee elle エニ ョ イニ ョ イニ ョ コー デニ ョ スコ lq Bee alle ae le fie ee Be elle Bee elle Bee Selle Be a Bm elle Be ee Ben elle Bn mln Bs Salle Bee ami Bee ee Bee ele Bee ln fn mn Be le Be nen Bee "= Be "Se Be elle om 


8-157 ”选中 没有 数据 时 要 显示 的 区 域 


单 击 “ 应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 写 “+” 控 钮 ， 在 弹 
出 的 六 单列 表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 来 记录 集 为 容 则 显示 区 域 ”选项 ， 打 开 “ 如 果 
记录 集 为 空 则 显示 区 域 ”对 话 框 ， 在 “记录 集 ” 中 选择 Rs， 青 单 击 “确定 ”按钮 回 到 编 
辑 页 面 ， 将 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 .…” 
的 灰色 否 标 ， 这 表示 已 经 完成 设 是 ， 设 置 及 效 末 如 图 8-158 所 示 。 


邓 来 记 承 集 为 空 则 显示 医 城 


如 束 罕 全 此 条 件 则 显示 .… . 
目前 天 日 记 ，; 博 汪 加 日 记 


Bde Bae ede Bee ee Ba ee Bee ele Be ele Be ee Ben lle Bee Sle Bee a Bee lle ae "am Bee elle Be lle Be elle Rn elle Be ele Bee ele Be ed Be el Be ee Bae ed Be de Be ee Bee ede Bee lle Be le Bee Talla Bee elle Bee elle Be ui le el 


8-1S8 ”记录 集 为 空 则 显示 的 区 域 


学 :证 天 到 博客 系统 


把 限 标 移 人 至 要 加 入 “记录 和 集 导航 条 ”的 位 置 ， 单 击 “ 择 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 条 ”按钮 事 |， 打 开 “ 记 录 集 导航 条 ”对 话 框 ， 选 取 要 导航 的 记 
录 集 以 及 导航 的 显示 方式 ， 然 后 单 击 “确定 ”按钮 回 到 编辑 页 面 ， 此 时 页 面 将 出 现 该 记录 集 
的 导航 条 ， 如 图 8-159 所 示 。 OO) 


记 邓 集 写 有 条 


: 36 己 吉 末 装 台 i il 此 条 件 | IM 


冲 - 页 | 了 -页 | 个 页 | 展 后 -页 | 


图 8-159 ”加 入 “记录 和 集 导 航 条 ” 


选中 编辑 页 面 中 的 字段 Rs.log_title， 然 后 单 击 “服务 器 行为 ”面板 中 的 “+” 
按钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 打 开 “ 转 到 详细 页 面 ” 对 话 框 ， 蛙 击 
“浏览 ”按钮 ， 打 开 “ 选 择 文 件 ” 对 话 框 ， 选 择 log_class.asp ,“ 传 递 URL 参数 ”选择 记录 
集 Rs 中 的 log_ID 字段 ， 其 他 设 定 值 都 不 改变 其 黑 认 值 ， 如 图 8-160 所 示 。 


mmm rm 
传递 URL 参数 :Log TD | 设置 为 以 下 项 的 值 
记录 集 : Rs v| 


列 ; Loe ID \| 


传递 现 有 参数 : 口 um 参 数 
口 ] 表单 驮 数 


图 8-160 设置 “ 转 到 详细 页 面 ” 对 话 框 


选中 编辑 页 面 中 的 文字 “修改 ”， 然 后 单 击 “服务 硕 行 为 ”面板 中 的 加 扎 
“+ 二” 投 钮 ， 在 弹出 的 沫 单 中 选择 “ 转 到 详细 页 面 ”选项 ， 打 开 “ 转 到 详细 页 面 ”对 话 框 ， 
单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 admin log classupd.asp ，“ 传 递 URL 
参数 ”选择 记录 集 Rs 中 的 log _ID 字段 ， 其 他 设 定 值 彰 不 改变 其 默认 值 ， 如 图 8-161 所 
不 。 
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详细 信息 页 |adnin_ log_classupd_asp ー ] 
传递 URL 参 数 : 1og m | 设置 为 以 下 项 的 值 
记录 集 : Rs マ 


列 : 1oe | 
传递 现 有 和 参数 : [ ] umr 参数 
口 ] 表单 参数 


图 8-161 设置 “ 转 到 详细 页 面 ” 对 话 框 
选中 编辑 页 面 中 的 文字 “删除 ” 然后 单 击 “ 服 务 咒 行为 ”面板 中 的 加 二 “十 ” 
按钮 ， 在 弹出 的 荣 单 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 打 开 “ 转 到 话 细 页 面 ” 对 话 框 ， 单 击 
浏览” 按钮， 打开“ 选择 文件 ”对 话 框 ， 选 择 admin log classdel.asp ,;“ 传 递 URL 参数 ” 选 
择 记 录 集 Rs 中 的 log _ID 字段 ， 其 他 设 定 值 都 不 改变 其 默认 值 ， 如 图 8-162 所 示 。 


汪 按 [TE 


设置 为 以 下 项 的 值 
记录 和 集 : Rs y 
列 。 [leg ID 加 
传递 现 有 和 参数: | | mr 参数 
し | 表单 参数 


图 8-162 设置 “ 转 到 详细 页 面 ” 对 话 框 
下 面 将 制作 添加 日 记 列 表 ， 主 要 方法 是 将 页 面 中 的 表单 数据 新 增 到 blog log 数 
据 表 中 ， 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 ( 査 銘 )” 
选项 ， 打 开 “ 记 录 集 ”对 话 框 ， 参 数 设 置 如 网 8-163 所 示 。 


: | connb1og 


< |1og_type 


「 や) 全部 〇 选 定 的 : 


选 : user_username 
阶段 变量 \| [MMM_username 


:无 EE 


图 8-163” 设 定 Rs2“ 记 录 集 ”对 话 框 


有 : 二 请 了 博客 系统 


绑 定 记录 集 后 ， 单 击 “ 分 类 ”的 列表 /菜单 ， 在 分 类 的 “动态 列表 / 麻 蛙 ”属性 面 
板 中 ， 单 击 区 _ 动 达 .| 按钮 ， 打 开 “ 动 态 列表 /菜单 ”对 话 杠 ， 参 数 设 置 如 图 8-164 所 示 。 


来 自 记录 集 的 选项 :| Rs2 


5 |1og_class_TI 


5 |1og class name 


图 8-164 绑 定 动态 列表 
插入 一 个 隐藏 区域， 然后 将 绑 定 面板 中 的 Session 变量 MM username 绑 定 到 
页 面 中 名 为 user username 的 隐藏 域 中 ， 如 图 8-165 所 示 。 


ute 


IN 障 立 区 域 
user_usernar 価 W) = Session("MM_username") %> | 多 


图 8-165 ” 绑 定 字段 到 隐藏 域 中 


在 admm log class.asp 编辑 页 面 中 ， 单 击 “ 应 用 程序 ”和 面板 群 组 中 的 “服务 器 
行为 ”面板 标签 中 的 加 号 “+” 按 钮 。 在 弹出 的 荣 单 列表 中 ， 选 择 “ 插 入 记录 ”选项 ， 在 
“插入 记录 ”对 话 框 中 ， 输 入 如 图 8-166 所 示 的 参数 ， 设 定 新 增 数据 后 转 到 个 人 日 记 管 理 主 


页 面 user admin.asp。 


< [connbloe bal 
插入 到 表格 : |blog_log マ | 
插入 后 ， 转 到 |: user_admin. asp | 
获取 值 自 : | Eorm1 当 [在 提 变 时 ) 
表单 元 素 : oz t と 上 忆捷 人 Si og Ge 
user_ SeLrI 二 er _username (VM) 


og _ class "TD 医大 到 列 | 中 * lo a ass _ID EMI= 削 
og cort emt 抽 入 色 | 列 中 “1。 g_cortert" (区 本 ) 


列 |: [log_title vy 


提交 为 : 文本 可 


图 8-166 设 定 “插入 记录 ”对 话 框 
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选择 表单 执行 菜单 柱 中 的 “窗口 ”一 “行为 ”命令 ， 打 开 “ 行 为 ”面板 ， 单 击 
“行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 行为 列表 中 ， 选 择 “ 检 查 表单 ”打开 “检查 表 
单 ” 对 话 框 ， 设 置 log title 和 log_content 两 个 文本 域 的 值 都 为 “必需 的 ” 可 接受 “任何 东 
西 ?， 设 置 如 图 8-167 所 示 。 


可 接受 : (任何 东西 〇 数字 
〇 电子 邮件 地 址 〇 数字 人 | | 到 | | 


8-167 设置 “检查 表单 ”对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 完 成 admin log class.asp 页 面 的 设计 ， 完 成 后 
的 效果 如 图 8-168 所 示 。 


守 ni い chap08 い admin_1og_class.asp (GrHTWL) EX 


Hi connblog. asp style.css 


喝 子 二宮 


如 有 果 符 合 此 条 件 则 显示 .. . 
日 记 列 表 管理 : 


剛 半 操 東 符合 此 欠 件 則 早 示 
:目前 无 日 记 ， 请 添加 日 记 4 


《 > 
<body> <div#top> DER 871 x 517v 276 K / 6 秒 | 简体 中 文 (GB2312) 


8-168 完成 后 的 admin log class.asp 页 面 的 效果 


修改 日 记 列 表 页 


接 下 来 设计 修改 日 记分 类 的 页 面 admin log classupd.asp， 这 个 页 面 的 主要 功能 是 将 数据 


博客 系统 


表 中 的 数据 送 到 页 面 的 表单 中 进行 修改 ， 修 改 数据 后 再 更 新 到 数据 表 blog log 中 ， 页 面 设计 
如 图 8-169 所 示 。 


画 adnin log classupd. asp 


i connbloe. asp style.css 


Copyrieght 2D00-2008 蝎子 记忆 ALL Ri ehts Reserved. 
E-mail: jamboldt2b, com 


<body> <div#top> <divibanner> <div. banner> km 100% v902 x 375v 73 K /11 秒 简体 中 站 (6B2312) 


8-169 ”修改 日 记 内 容 页 面 效果 


制作 步骤 如 下 : 

创建 该 页 面 的 静态 效果 ， 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选 
项 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 再 单 击 “ 局 级 ”按钮 进入 局 级 
模式 徐 口 ， 在 打开 的 “记录 集 ” 对 话 框 中 输入 如 图 8-170 所 示 的 参数 ， 单 击 “ 确 定 ” 控 钮 则 


完成 设 定 。 


名 称 : 


: SELECT * 


FROM blog log 
WHERE log ID=Muse And user_username=’ MMuser’ 


型 : WA 


‘request. querystrinel 1og ... 
県 け 計 0 


由 团 表格 


還 店 
类 ”预存 过 和 ーー 


URIER BY 


8-170” 设 定 “ 记 录 和 集 ” 对 话 框 
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语法 说 明 : 


SELECT * 

FROM blog log 

WHERE log ID=Muse And user username='MMuser 

// 根 据 条 件 log ID=Muse And user username='MMuser， 从 blog log 数据 表 中 选择 出 所 有 的 字段 。 


绑 定 记录 后 ， 将 log title 字段 和 log content 字段 插入 到 网 页 的 适当 位 置 ， 如 疼 
8—171 所 示 。 


和 


i ne er ETRE nr nt mn 
= に Pi 1 
= ] 
さて こい ここ て = 
] IRs. lug cort ent 


人 ai 


图 8-171 插入 字段 


再 单 击 “ 绑 定 ” 和 面板 中 的 “+” 号 按钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 《得 
询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 “记录 集 ” 对 话 框 中 输入 如 图 8-172 所 示 的 参数 ， 
再 单 击 “ 确 定 ” 投 钮 则 完成 设 定 。 


| connblog 
|1og type 


「 で ) 全部 し 选 定 的 : 


[ 
| 

yy ,9 < 
li 

| 

| 

| 

| 

外 

L 


:| user userTame 


| 阶段 变量 vw | MN_us Er TAME | 


无 回 Hs 


图 8-172” 设 定 Rs2“ 记 录 集 ”对 话 框 


绑 定 记录 集 后 ， 单 击 “ 分 类 ”的 列表 / 沫 单 ， 在 “分 类” 的 “动态 列表 / 沫 单 ” 
属性 面板 中 ， 单 击 名 动态 .| 按钮 ， 打 开 “ 动 态 列表 /菜单 ”对 话 框 ， 在 打开 的 “动态 列 


E 当 : 刁 再 博客 系统 


表 / 沫 单 ” 中 设置 如 图 8-173 所 示 。 


动态 列表 /3 溢 单 


来 自 记录 集 的 选项 ， |Rsz 


蛋 : |1og_c1as = TI et | 


; [log class name | 


: 区 (Rs. Fields. Item (“log class II 到 


图 8-173” 绑 定 动态 列表 


完成 表单 的 布置 后 ， 要 在 admm log classupd.asp 页 面 中 加 入 “服务 硕 行 为 ” 
中 的 “更 新 记录 ” 设 定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 “+” 瑟 按 
钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “ 更 新 记录 ”选项 ， 在 打开 的 “更 新 记录 ”对 话 杠 中， 输入 
参数 如 图 8-174 所 示 。 


和 连接: ™ ド 
要 更 新 的 表格 : | 
选取 记录 自 : | Ha 
唯一 键 到 :| 15 ーー | 
在 更 新 后 ， 转 到 : |adnin_log_class. asp 

“区 
表单 元 素 : 

中 Eh 3 Ge Es ig 

textarsa 忠 新 別 "ag content" 


国人 


图 8-174” 设 定 更 狐 记录 


单 击 “确定 ”按钮 回 到 编辑 页 面 则 完成 修改 日 记分 类 页 和 面 的 设计 ， 效 果 如 


图 8—175 所 示 。 


四 D:Achap08sadmir_log_classupdasp (XHTHL) 


記入 connblog.asp style.css 


天 于 我 /新 闻 公 告 /我 的 好 点 /最 近 态 客 /最 新 评 做 /后 新 留言 


く 
く body> <div#top> 


设计 删除 日 记 列 表 的 页 面 admin log classdelasp， 该 页面 的 设计 和 修改 日 记 列 表 页 面 差 


不 多 ， 页 面 效果 如 图 8-176 所 示 。 其 方法 是 将 表单 中 的 数据 从 站 点 的 数据 表 中 删除 。 


ED: \chaposadmin log_classdel.asp (XHTHL)* 


HR connblog. asp style.css 


关于 我 :新闻 公 洁 / 我 的 好 友 / 最 近 坊 客 /最 新 评 伦 / 最 新 留言 
< 


le 


<body> <divimid> <div. content> <form#forml > 


8-176 删除 日 记 内 容 页 面 效果 


871 x 439v 254 K/ 6 秒 簡体 中 文 GB2312) 


过 :二 项 沁 博客 系统 


制作 步骤 如 下 ; 
创建 该 页 面 的 静态 效果 ， 然 后 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 

的 选项 中 ， 选 择 “ 记 录 集 〈 查 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 再 单 击 “ 高 级 ”按钮 进 ー 

入 高 级 模式 窗口 ， 在 打开 的 “记录 集 ” 对 话 框 中 输入 如 图 8-177 所 示 的 参数 ， 单 击 “ 确 定 ” 他) 

按钮 则 完成 设 定 。 に 2 


「 
[Es| | 
Bl 


EPS Cx) 
: SELECT * ー _ 


FROM bloe las 
|WHERE log ID=Muse Arud user username= Miluser’ 


基数 : 十 | | 一 | 


| 者 都 : Mase 


|MMaser 


] 眉 :raquest. querystrinel"log ... 
默认 值 : 0 
ER 


表格 添加 到 39L: 
四 万 ”视图 [smcr ] 


类 ”预存 过 程 ne 
[mama | 


图 8-177 设 定 “ 记 录 集 ”对 话 框 


绑 定 记录 后 ， 将 log title 字段 和 log_content 字段 插入 到 网 页 的 适当 位 置 ， 如 
8-178 所 示 。 


归队 日 记 
ds 
rE 
标题 : ] Rs. ng titl 
・ 2. lng title 
RAR ns 
| we 
rna 1 
eR A ot PTI 
Es. lng content} | 


图 8-178 插入 字段 


再 单 击 “ 绑 定 ”面板 中 的 加 号“+” 按 钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 


( 合 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 “记录 集 ” 对 话 框 中 输入 如 图 8-179 所 示 的 参 
数 ， 再 单 击 “确定 ”按钮 则 完成 设 定 。 


名 称 : 弄 
连接 : | connblog 
表格 : og:type 


列 : @@ 全 部 〇 选 定 的 : 


簿 选 : | user_username v = 
| 阶段 变量 | lusernane 
排序 : 无 vy 升序 


图 8-1759 设 定 Rs2“ 记 录 集 ”对 话 框 


绑 定 记录 集 后 ， 单 击 “ 分 类 ”的 列表 / 沫 单 ， 在 “分 类” 的 “动态 列表 / 沫 单 ” 
属性 面板 中 ， 单 击 区 。 _ 动 达 .按钮 打开“ 动态 列表 /菜单 ”对 话 框 ， 在 打开 的 “动态 列表 / 
菜单 ”中 设置 如 图 8-180 所 示 。 


动态 列表 7 党 单 


来 自 记录 集 的 选项 : | 


2 1 og _ class TI 


: log class name マ | 


: [GE GRs.Tie1ds.Ttem("1og clsss TI 他 


圏 8-180 绑 定 动态 列表 


完成 表单 的 布 阐 后 ， 要 在 admin log _ classdelasp 页 面 中 加 入 “服务 磺 行 为 ”中 
的 “更 新 记录 ”议定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 
钮 。 在 弹出 的 荣 单 列表 中 ， 选 择 “删除 记录 ”选项 ， 在 打开 的 “删除 记录 ”对 话 框 中 ， 输 入 
参数 值 如 图 8-181 所 示 。 


演 接 . [EEC | 
从 表格 中 删除 : blog 1cg | 
选取 记录 自 : Rs 


唯一 键 列 : 1og_ID 
提交 此 表单 以 删除 : | fm 
删除 后 ， 转 到 : |adnin_loe_class. asp 


图 8-181 设 定 “删除 记录 ”对 话 框 


单 击 “ 硝 定 ”按钮 回 到 编辑 页 面 则 完成 删除 日 记分 类 页 面 的 设计 ， 效 末 如 
图 8-182 所 示 。 


中 | D:Acehap08admimr_ log _ classdel.asp (XHTML) = x 


A connblog. asp style. css 


蝎子 博客 


关于 我 /新 闻 公 省 /我 的 好 友 / 最 近 访 客 /最 新 评论 /最 新 留言 


图 | | > 
<body> <div#top> 259 Kf 6 秒 筒 体 中 文 GB2312)  : 


8-182 admin log classdel.asp 页 面 的 设计 效果 


人 博客 分 类 党 理 页 面 


博客 分 类 管理 页 面 admin blog type.asp 是 管理 员 admin 通过 前 人 台 登 录 后 ， 进 入 的 一 
个 党 理 页 面 。 主 要 功能 是 对 博客 分 类 进行 修改 、 删 除 和 添加 操作 。 页 面 的 设计 效果 如 图 
8-183 所 示 。 


局 D:vehap0svadnin_ blog_trpe.asp (XHTNL)* - x 


PR connblog. ssp style. css 


喝 プ 二宮 


添加 博客 分 类 : 


捕 客 分 类 名 称 : 


Me 
8 博客 分 类 名 称 : 理 
: Em | 、 に 1 

ミト ュー ュー ュー ューーーーーーーーー バ ーーー こ ーーーーーーーーー バ ーーーーーーーーーーーーーーー ド ーーー 


こ ー こ ーーー こ ーーーー こ ーーー こ ーー 
修 改 ”删除 
> 
* ホホ 
PP TT 


Ca 
に 
> 


关于 我 /新 闻 公 告 /我 的 好 友 / 最 近 访 客 /最 新 评论 /最 新 留言 


© > 
< も ody> Cdivimid> <div. content> IgG 871 x 439v 256 K / 6 秒 簡体 中 文 (GB2312) . 


8-183 ”博客 分 类 管理 页 面 效 果 图 


制作 步骤 如 下 : 
在 admin blog type.asp 页 面 中 表单 froml 中 的 文本 域 和 文本 区 域 的 设置 见 
表 8-4。 
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表 8-4 表单 ffom1 中 的 文本 域 和 文本 区 域 设置 


意 义 文 本 (区 ) 域 /按钮 名 称 


添加 博客 分 类 typename 单行 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 
中 输入 如 图 8-184 所 示 的 参数 。 

单 击 “确定 ”按钮 ， 完 成 记录 和 集 Rs 的 绑 定 ， 把 绑 定 的 Rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-185 所 示 。 


凌 


名 称 : 国 
连接 : | connblog 
表格 : blog_type 


列 : @ 全 部 〇 选 定 的 : 


ご に 。 
Pe 入 衝 本 小生 和義 穫 科 r 
址 客 另类 略称 : ] 1 
1 hr 
IE ] 四 
か 
で で で で で で で で で で で で で て で で で で て て て で で で て て て で で て も いい いも て て て いい てい tt 
担 客 号 到 | 表 ・ 
に a 
和 Le 
和 円 
3 3 に ーー 
= 中 5 に | - 
和 円 
了 
和 円 
Rs. typename : < 
・ 四 Pr 1 
ーー 
下 \ 
ク 1 
ビラ = S と E ル 
二 に 


由 于 admin blog type.asp 页 面 要 显示 数据 表 blog type 中 的 所 有 记录 ， 而 目前 
的 设 定 只 能 显示 数据 库 的 第 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 
定 ， 单 击 admin blog type.asp 页 面 中 要 重复 的 表格 ， 如 图 8-186 所 示 。 


{Rs. tyEeramel 


图 8-186 选择 需要 重复 的 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“+ ”按钮 。 在 弹出 的 菜 音 中， 选择“ 重复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 在 “ 重 
复 区 域 ” 对 话 框 中 ， 设 定 一 页 显示 的 数据 记录 为 “所 有 记录 ”如 图 8-187 所 示 。 

单 击 “确定 ”按钮 回 到 编辑 页 面 ， 将 
发 现 乙 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 一 个 
“重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

单 击 “ 应 用 程序 ”面板 中 的 “服务 需 
行为 ”标签 中 的 “+” 号 按钮 。 在 弹出 的 玉音 列表 
中 ， 选 择 “ 插 入 记录 ”选项 ， 在 “搬入 记录 ”对 话 
框 中 ， 输 入 如 图 8-188 所 示 的 参 数 , 設定 新 増 数 据 
后 转 到 个 人 日 记 管 理 主页 面 admm log type.asp。 图 8-187 选择 记录 集 的 显示 数量 


第 8 章 CE 所 


插入 到 表格 : (blog_type 
插入 后 ， 转 到 |: /adnin_b1og_type. asp 


获取 值 自 : | Eorm1 ーー 
表单 元 素 : | tpanane 插 入 到 emuame 


图 8-188 ” 设 定 “插入 记录 ”对 话 框 
单 击 “确定 ”按钮 完成 记录 的 插入 ， 选 择 表 单 执行 沫 单 栏 中 的 “窗口 ”一 “ 行 
为 ”命令 ， 打 开 “ 行 为 ”面板 ， 单 击 “ 行 为 ”面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 行为 列表 
中 ， 选 择 “ 检 查 表 单打 开 “ 检 查 表 和 单 ” 对 话 杠 ， 设 置 typename 文本 域 的 值 都 为 “必需 
的 ”， 可 接受 “任何 东西 ”设置 如 图 8-189 所 示 。 


值 : 必需 的 


可 接受 : (や 任 何 未 丁 〇 数 字 
C 〇 电子 邮件 地 址 ”C 〇 ”数字 从 


图 8-189 设置 “检查 表单 ”对 话 框 


编辑 页 面 中 的 文字 “修改 ”和 “删除 ”的 连接 必须 要 传递 参数 给 前 往 的 页 面 ， 
这 样 前 往 的 页 面 才 能 够 根据 参数 值 从 数据 库 中 和 莽 选 出 茶 一 条 记录 进行 编辑 。 选 中 编辑 页 和 面 中 
的 文字 “修改 ” 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 选择 “ 转 到 
详细 页 面 ” 选项 ， 在 打开 “ 转 到 详细 页 面 ” 对 话 框 中 ， 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文 
件 ” 对 话 框 ， 选 择 /admin blog upd.asp,“ 传 递 URL 参数 ”选择 记录 集 Rs 中 的 type ID 字 
段 ， 其 他 设 定 值 都 不 改变 其 默认 值 ， 如 图 8-190 所 示 。 


详细 信息 页 : |/adanin blog upd asp | 
传递 URL 参数 : [typeID O ] 设置 为 以 下 项 的 值 


记录 集 :|Rs vy 


列 : |type_ID ww | 


传递 现 有 戎 数 : [] ur 参数 
[表单 参数 


图 8-190 设置 “ 转 到 详细 页 面 ” 对 话 框 


二 デ 」 
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选中 文字 “删除 ”并 重复 上 面 的 操作 ， 将 要 转 到 的 页 面 改 为 /admin blog_ 
delasp， 如 图 8-191 所 示 。 


转 到 证 细 页 面 


链接 : | 轩 山 访 潮 wv 
详细 信息 页 
传递 UEL 参 数 : 设置 为 以 下 项 的 值 
记录 入 
列 : | type_ID マ 
传递 现 有 参数 : [| ] mr 参数 
し | 表单 参数 


8-191 设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “确定 ” 投 钮 ， 完 成 博客 分 类 管理 页 徊 admin_blog type.asp 的 制作 , 完成 
后 的 效 采 如 图 8-192 所 示 。 


守 D: vechap08vadmin blog_type.asp (XHTHL) al 


Hi connblog. asp style. css 


蝎子 博 吕 


添加 博客 分 类 : 


:修改 删除 | 


关于 我 /新 闻 公告 /我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 久 Fomyriekt 2000-2008 蝎子 记忆 ALl Rights Reserve 


E-mail: 1ambo@126. com 
< 
<body> <div#top> 


8-192 admin blog type.asp 页 面 效 果 
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30 修改 博客 分 类 页 面 


接 下 来 要 设计 修改 博客 分 类 的 页 面 admm blog upd.asp， 这 个 页 面 主要 是 将 数据 表 中 的 
数据 传送 到 页 面 的 表单 中 进行 修改 ， 修 改 数 据 后 再 更 独到 数据 表 blog type 中 ， 页 和 面 设计 如 


图 8-193。 
操作 步骤 如 下 : 


在 admm blog upd.asp 页 面 中 表单 foml 中 的 文本 域 和 文本 区 域 的 设置 见 表 8-5。 


ED: \chap0s\admin blog_upd. asp (XIHTIL)# 


PR connblog. asp style. css 


yright 2000-2008 蝎子 记忆 并 1 Ri ehts Reserve 
E-mail: 1amboB126. com 


关于 我 /新 闻 公 党/ 我 的 好 友 / 最 近 访 客 / 最 新 评论 /最 新 留言 
BT1 x 439v 25BK/B 秒 筒 体 中 文 (GB2312) 


る | 而 
く body> <divimid> <div. content> <form#forml > <table> <tr> <td>Kinput#typename】 |W | 
8-193 ”修改 博客 分 类 页 面 效果 图 


表 8-5 表单 ffom1 中 的 文本 域 和 文本 区 域 设 置 


文 本 (区 ) 域 /按钮 名 称 
单行 


修改 博客 分 类 typename 
单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 和 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 和 集 ”对 话 框 
中 输入 如 图 8-194 示 的 参数 。 
名 称 : 国 ws 
表格 noewe 上 加 


列 : @ 全 部 〇 选 定 的 : 


排序 天 序 


8-194 ” 绑 定 记录 和 集 s 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 rs 的 绑 定 ， 把 绑 定 的 rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-195 所 示 。 


8-195 ”插入 字段 
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完成 表单 的 布 阐 后 ， 要 在 admin blog upd.asp 页 面 中 加 入 “服务 器 行 为 ”中 的 
“更 新 记录 ” 设 定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 喜 行 为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 更 狐 记 录 ” 选 项 ， 在 打开 的 “更 狐 记 录 ” 对 话 杠 中， 输入 参数 值 
的 如 图 8-196 所 示 。 


要 更 新 的 表格 : ara 

选取 记录 自 zs ~ 

唯一 键 列 ; 中 数值 
在 更 新 后 ， 转 到 |: 


获取 值 自 ; 寿 提 六 时 ) 


ma 
| 


8-196 ” 设 定 “更 独 记 录 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 完 成 修改 博客 分 类 页 面 的 设计 ， 如 图 8-197 
所 示 。 


TD: \chap03\admin_blog_upd. asp (XHTNL) PE 


く 
<body> <div#top> 


8-197 admin blog upd.asp 页 面 效果 


:于 下 删除 博客 分 类 页 面 


设计 删除 博客 分 类 的 页 面 admin blog del.asp， 该 页 面 的 设计 和 删除 日 记 列 表 页 面 差 
不 多 ， 页 面 效果 如 图 8-198 所 示 。 其 方法 是 将 表单 中 的 数据 从 站 点 的 blog type 数据 表 中 
删除 。 


ED: \chapos\admin blog_del. asp (XHTNL)* 


PR connblog. asp style. css 


E-mail: 1ambo@12 


关于 我 /新 闻 公 告 /我 的 好 皮 / 最 近 访客 /最 新 评论 /最 新 留言 Copyright 2000 og Reseryed 
< | 川 | > 
odw> Cdiv... > Xdiv... > Xform... > く tab1e> く tr> <td> 1abel> く input#tvpename | IS2 KR 100%X v871 x 439v| 255K ア BE 秒 筒 体 中 文 (GB2312)  .: 


8-198 删除 页 面 的 设计 


操作 步骤 如 下 : 
在 admin_blog_ delasp 负面 中 表 香 foml 中 的 文本 域 和 文本 区 域 的 设置 匈 表 8-6。 


表 8-6 表单 ffom1 中 的 文本 域 和 文本 区 域 设置 


意 义 文 本 (区 ) 域 /按钮 名 称 类 型 


单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 和 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 和 集 ” 对 话 框 
中 输入 如 图 8-199 所 示 的 参数 。 


名 称 : 国 | 
表格 
列 : ぐ 全 部 ( 〇 选 定 的 ; 


二 到 


8-199 绑 定 记录 集 rs 


单 击 “确定 ”按钮 ， 完 成 记录 集 rs 的 绑 定 ， 把 绑 定 的 rs 中 的 字段 插入 到 网 页 
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ンズ 


アオ Dreannweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


的 适当 位 置 ， 如 图 8-200 所 示 。 


に 
册 | 际 博客 部 闪 : 
a も も も も エキ も モエ ミキ モエ モモ エキ モエ て モモ エキ モモ エミ モモ ミエ も キモ エミ も モミ エモ モモ も モモ エモ モエ も キモ エモ エモ モエ エモ エモ エミ モモ もそ モモ モエ も モミ エモ も モモコ 
:博客 部 兴 镍 称 : :| rg.+ymemamgl 。 _| | 删除 
ロ 画 
: | {ra.twypernamel} 十 
和 PPE 


图 8-200 ”插入 字段 


完成 表单 的 布置 后 ， 要 在 admin blog delasp 页 面 中 加 入 “服务 器 行为 ”中 的 
“删除 记录 ” 设 定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 删 除 记录 ”选项 ， 在 打开 的 “删除 记录 ”对 话 框 中 ， 输 入 参数 什 
如 图 8-201 所 示 。 


连接 : | 


w | 
| 


选取 记录 自 : rs ~ 


唯一 键 列 : | type_ID v| 較 数值 
提 变 此 表单 以 删除 :| forml | 
册 除 后， 转 到 : /adnin_blos_type. asp 


图 8-201 设 定 “删除 记录 ”对 话 框 


当 管 理 员 单 击 “删除 ”按钮 时 可 将 博客 分 类 进行 删除 ， 但 为 了 慎重 起 见 ， 
有 必要 提示 管理 员 是 否 确定 要 删除 这 个 博客 分 类 ， 单 击 选择 “删除 ”按钮 ， 再 单 击 “ 显 
不 代码 视 图 ”按钮 加 人 进入 代码 视 口 ， 将 “删除 ”按钮 中 的 <inpu 全 中 的 代码 修改 
为 如 下 内 容 : 

<input name="Submit" type="submit" onclick="GP popupConfirmMsg(' 人 确定 删除 吗 ?");return 
document.MM returnValue" value=" 删 除 " /> 

/ 当 单 击 “ 确 定 ” 投 钮 时 弹出 一 个 新 的 窗口 ， 提 示 “ 确 定 删除 吗 ? ” 

测试 效果 如 图 8-202 所 示 。 


Nicrosoft lnternet Ezplorer 区 | 


、 ジ 确定 册 除 吗 ” 


图 8-202 弹出 的 提示 窗口 效果 


完成 后 的 admin blog delasp 页 面 效果 如 图 8-203 所 示 。 


效果 如 图 8-204 所 示 。 


ED: \chap08\admin blog. asp (XHTHL)* 


HTN connblog. asp style. css 
蝎子 二 器 


: 用 户 博客 信息 : 


关于 我/ 世间 公告/ 我 的 好 友 / 量 近 沪 客 / 量 新 证 论 /是 新 外 言 Friav 2mtr toe 昌子 AH Riehts here 
< | 中 
8-203 ”完成 后 的 admin blog delLasp 页 面 效果 
8.4.12 
博客 列表 管理 页 面 admin blog.asp 用 于 显示 所 有 用 户 博 客 列 表 ， 并 通过 该 页 面 可 以 链接 
到 是 否 推荐 页 面 admin blog good.asp 和 删除 用 户 博 客 页 面 admin del blog.asp， 页 面 的 设计 
_nx 


> 


871 x 439v 260 K / 6 秒 | 简体 中 文 (GB2312) | 


天 于 我 /新 闻 公告 /我 的 好 点 /县 近 访 客 /最 新 评论 /最新 留言 
LR 


图 8-204 ”博客 列表 管理 页 面 的 效果 图 


详细 制作 步骤 如 下 : 
打开 “记录 集 ” 对 话 框 再 单 击 “ 局 级 ”按钮 进入 噩 级 模式 窗口 ， 在 打开 


单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 
“记录 集 ” 对 话 框 中 输入 如 图 8-205 所 示 的 参数 ， 单 击 “ 确 定 ”按钮 后 则 完成 设 定 。 


( 伍 询 )” 选 项 


Es| | 
: | cormub]og ~ 


es 六 


FROM wu 
DRDER BY u user_ blog good DESC, nssr TI DESC 


: は | 


: 七 ”表格 添加 到 SL: 


四 内 视图 し し srcr 」 
現存 党 程 ーーー 


UERTER BY 


8-203 ” 设 定 “记录 和 集 ” 对 话 框 


绑 定 记录 后 ， 将 绑 定 的 字段 插入 到 网 页 的 适当 位 置 ， 如 图 8-206 所 示 。 


TT TT CC nC TR DR EECECRCEEICEEEEEETEEEECECEEEE 
用 戸 汰 : 博客 分 类 博客 名 日 记 笋 是 盏 推荐 编辑 

二 
站 FL を を モモ トト キモ トキ キモ トモ キモ モモ モモ モモ モモ モモ Dn 
: {Rs. user username}: {Rs. typename}: {Rs. user blog name}: {Rs. user post mm}: vo 册 | 险 


eT NT SDS ART a RT ERR 区 も も L も も も も も も も も 


8-206 ”插入 字段 


选择 页 面 中 “是 否 推荐 ”单元 格 下 方 的 两 个 小 图 标 ， 在 属性 面板 中 设置 它们 的 
“ 蔡 换 ” 值 分 别 为 “取消 推荐 ?” 和 “ 设 为 推荐 ?”， 如 图 8-207 所 示 。 


品 尾 


図像 , 1K 喜 16 源 娘 件 ) [mages/icon pass. gif 3 蔡 换 立 ) 取消 推荐 ? に 2 类 [C) 无 wv 
DG)| |) 高 8 链接 已 ) | 3 编 拖 回 まず 


地 图 几 [] 委 直 浪 距 OO] 。 目标) 边框 @) [对 基 们 A 
kK| 门 〇 NJ 水 平 边 距 双 ) 原始 Gy 对齐 的 | 默认 值 v | 
に 3 


図像 , 1K 喜 16 源 亡 件 (8) limages/icon del. gif 等 已 苦 换 全 】 设 为 推荐 3? wv 美 (C) 无 wv 
の [| | 高 区 WE ob 全 回 ずっ 


地図 OW) 委 直 边 距 ⑩ 目标 他 边框 @) EE 合生 A 
ト | ロロ OM 水 平 边 距 外 ) 原始 | ya 对 六 多 | 默认 值 v 


8-207 ”设置 奉 换 值 


再 选择 页 面 中 “是 售 推 荐 ”单元 格 下 方 的 两 个 小 图 标 ， 切 换 到 代码 窗口 ， 加 入 
相应 代码 如 下 : 


<% if( Rs.Fields.Item( "user blog good").value)=1 1hen %> 


<img src="images/icon pass.gif' alt=" 取 消 推荐 ? "width="16" height="16" border="0" /> 
<%Else%> 
<img src="images/icon_del.gif" alt=" 设 为 推荐 ? " width="16" height="16" border="0" /> 


<% End ifV6% テ > 


学 :证 天 到 博客 系统 


语法 说 明 : 

如 果 记 录 集 中 user blog good 字段 的 值 等 于 1， 则 显示 icon pass.gif， 如 果 不 等 于 1 则 
显示 icon delL.gif。 _ 

由 于 admm blog.asp 页 面 应 显示 所 有 用 户 博客 的 信息 记录 ， 而 目前 的 设 定 只 能 OO) 
显示 数据 库 的 第 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 和 
admin log class.asp 页 而 中 的 要 和 曹 复 显示 的 表格 ， 如 图 8-208 所 示 。 


{Rs. user usernamelh {Rs. trpenamei {Rs. user blog nameiB {Rs. user pnst mim} jE : | 册 | 隆 


图 8-208 选择 要 重复 的 记录 集 表 格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 “+” 
号 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 “重复 区 
域 ”对 话 框 中 ， 设 定 一 页 显示 的 数据 记录 数 为 20， 如 图 8-209 所 示 。 


显示 (po | 记录 


( 〇 所 有 记录 


图 8-209 选择 要 重复 显示 和 记录 数 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

接 下 来 要 在 admin blog.asp 页 面 中 加 入 “记录 集 导 航 条 ” 用 来 分 页 显示 博客 
列表 数据 ， 把 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ?” 
标签 中 的 “记录 集 寻 航 条 ”按钮 恕 |， 在 打开 的 “记录 和 集 导 航 条 ”对 话 杠 中， 选中 要 导航 的 
记录 集 以 及 导航 的 显示 方式 ， 然 后 单 击 “ 人 确定” 按钮 回 到 编辑 页 面 ， 此 时 页 面 束 会 出 现 该 记 
录 集 的 导航 条 ， 如 图 8-210 所 示 。 


记录 和 集 叶 舱 条 


0 案 笠 志 站 各 音符 车 外 :各 第 符 全 弛 条 件 吉 果 符合 由 
: : 


ee 要 后 一 页 | 


图 8-210 ”加 入 “记录 集 导 航 条 ” 


第 -页 | 


2 


2 


5 
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选中 编辑 页 面 中 “是 否 推荐 ”下 方 的 所 有 ASP 代码 和 小 图 标 ， 单 击 “ 服 务 吉 
行为 ”面板 中 的 加 和 写 “+” 按 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详细 负面” 选项， 打开 “ 转 到 
详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文 件 ” 对 话 杠 ， 选 择 admin blog_ 
good.asp,“ 传 递 URL 参数 ”选择 记录 集 Rs 中 的 user ID 字段 ， 其 他 参数 值 都 不 改变 其 默认 
值 ， 如 图 8-211 所 示 。 


转 到 古 细 夏 面 


传递 UET 矢 数 : user_ID | 借 于 六 以 下 项 的 值 


| 
传习 现 有 釜 数 : | | jr 参数 
| | 表单 参数 


图 8-211 设置 “ 转 到 详细 页 面 ”对 话 框 


同样 选中 编辑 负面 中 的 文学 “删除 ”再 单 击 “服务 占 行 为 ”面板 中 的 加 号 
“+” 控 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详细 页 和 面 ”选项 ， 打 开 “ 转 到 评 细 页 面 ” 对 话 
框 ， 单 击 “ 浏 览 ” 按 钮 ， 打开 “选择 文件 ”对 话 框 ， 选 择 admin del blog.asp, “传递 
URL 参数 ”选择 记录 集 Rs 中 的 user _ID 子 段 ， 其 他 参数 值 虱 不 改变 其 默认 值 ， 如 图 8-212 
所 示 。 


壬 到 庄 细 责 面 


了 
详细 信息 页 


苇 阅 1RL 僚 数 : TI 


传递 现 有 参数 : | ] umr 参 数 
| ] 表单 参数 


图 8-212 设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 ， 则 完成 博客 列表 管理 页 面 admin_blog.asp 的 设计 和 制作 ， 
如 图 8-213 所 示 。 


如 果 符 合 遇 如 果 符合 此 :如 果 符 合 此 条 件 如 果 符合 此 条 件 则 显示 . 


关于 我 中 [ 间 公 告 /我 的 好 点 /县 近 态 客 / 旦 新 评论/ 县 新 鲁 言 


く 
く body> <div#top> 


8-213 admin blog.asp 的 设计 效果 


:二 推荐 博客 的 管理 页 面 


推荐 博客 的 管理 页 面 admin blog good.asp 是 根据 users 数据 表 中 的 user blog good 字段 来 确 
定 是 人 否 是 推荐 的 用 户 博 客 ， 所 以 制作 方法 驶 是 更 新 users 数据 表 中 的 user blog good 字段 ， 
user blog good 字段 值 为 1 时 为 推荐 博客 ， 为 0 时 不 是 推荐 博客 。 页 面 设计 效果 如 图 8-214 所 示 。 


守 : n: い chap08Vadmin_blog_good asp CXHTML)* 本 | 


HR connblog. asp style. css 〒 
内 


蝎子 博 吕 


设置 博客 是 否 为 推荐 : 


:OO 接 信 Ti 基 i] : 


Ss 


关于 我 /新 闻 公 洁 / 我 的 好 点 /最 近 仿 客 / 最 新 评 伦 / 最 新 留言 


图 TT | | 
body> く diy 和 mid> く diy. content> <form#forml > <table> <tr> <td> Tabe1>Gnpnt| [RI 871 x 439y 258K ア B 秒 简体 中 女 (GEB2312)  ，; 


图 8-214 推荐 用 户 博 客 管理 页 面 设计 效果 


制作 步骤 如 下 : 
创建 admin blog good.asp 的 静态 页 面 ， 加 入 两 个 单 选 按钮 ， 其 名 称 都 为 


ど ン Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


user_blog_good， 其 中 推 存单 选 按钮 值 为 1， 不 推荐 按钮 值 为 0,“ 属 性 ”面板 设置 如 网 8-215 
所 示 。 


RE 

の | 选 定 值 1 ] 阅 始 状 硒 已 加 选 亿 ) 类 (无 v| 
nser_blog_ec 7 __ 动态 直选 中 QU 

ttE 

加 | > 先 定 值 0 机关 状 基 站 已 网 授 避 类 @) | 无 司 
ser_L1og gr ジン 动态 . . . 求 选中 加) 


图 8-215 ”创建 单 选 按 钮 并 设置 其 属性 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 〈 奉 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 
中 输入 如 图 8-216 所 示 的 参数 。 


名 称 : 国 | 
和 连接 : | cormblog v| 
表格 : users yl 


列 号 全部 人 选 定 的 : 


端 延 : user_ID yl = 
Es 
EL 酸 剖 vY| Inser_1H 


排序 : | 无 网上 升序 


图 8-216 ” 绑 定 记录 集 Rs 


单 击 “ 人 确定” 按钮 ， 完 成 记录 集 Rs 的 绑 定 ， 把 绑 定 的 Rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-217 所 示 。 


a 


も も も セト モモ セミ モモ モト モモ モモ て エセ モモ モモ て モ モモ モモ モモ モモ トト セミ エエ セト エモ ミキ て エセ エエ エト エセ ミミ て キ セキ エセ モモ セ モ モモ トモ モミ モモ エモ エモ て モモ モモ エモ セコ 


Ra. mser_usetrTamel 推荐 《不 推荐 : 


TL も も も も 1 


图 8-217 插入 字段 


选择 “是 否 推荐 ”单元 格 下 方 的 任 一 个 单 选 按钮 ， 在 属性 面板 中 单 击 “ 绑 定 动 
态 源 ”按钮 区 动 查 .. |， 打开 “动态 单 选 按钮 ”对 话 框 ， 在 打开 的 “动态 单 选 按钮 ”对 话 
框 中 设置 “选取 值 等 于 ”为 “Rs” 记 录 集 中 的 user blog good 字段 ， 即 等 于 <%= 
(Rs.Fields.Item("user blog good").Value) %>， 如 图 8-218 所 示 。 


博客 系统 


单 选 校 钮 姐 :aser b1。g good" 在 FORM “forr 


人 


Er 
和信 


图 8-218 ”设置 动态 单 选 按钮 
单 击 “ 人 确定” 按钮 ， 完 成 对 动态 数据 的 绑 定 ， 再 单 击 “应 用 程序 ”面板 中 的 
“服务 占 行 为 ”标签 中 的 加 号 “+” 按 钮 。 在 弹出 的 亲 单 列表 中 ， 选 择 “ 更 狐 记录 ”选项 ， 在 
打开 的 “更 狐 记 录 ” 对 话 框 中 ， 输 入 参数 值 如 图 8-219 所 示 。 


要 更 新 的 表格 :|users ~» pm 


选 职 记 录 自 : Rs wv 


唯 二 键 列 : | user_ID x | 数值 
在 更 新 后 ， 转 到 : admin blog asp ーー Er 


获取 值 自 : 任 提 交 时 ) 
团 |ussr blog good 昌 新 列 | "user blog good" ( 笋 值 ) 


到 


图 8-219 设 定 更 新 记录 
单 击 “ 确 定 ” 按 钮 ， 回 到 编辑 页 面 则 完成 推荐 博客 
果 如 图 8-220 所 示 。 


Dn: \chap0s\admin blog_good asp (XHTHL) 


く 
<body><diy##top> 


8-220 admin blog good.asp 的 页 面 效 果 


一 和 
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二 旧 删除 用 尸 博 客 页 面 


最 后 设计 删除 用 户 博 客 的 页 面 admin del blog.asp， 其 方法 是 将 表单 中 的 数据 从 站 点 的 
数据 表 users 中 删除 ， 页 面 的 设计 效果 如 图 8-221 所 示 。 


| n: い chap08Vadmin_de1_blog.ssp (XHTNL)* _ 口 x 


HE connblog. asp style. css 


蝎子 博 品 


:确定 要 扣除 此 用 P3 
時 


. i rr NF 1 了 っ ， See Vda ， cv 4 ーー Popyriight:2( ー ゥ 8 4 ゴア ュ を の 
关于 我 /新 闻 公告 /我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 留言 Copyright 2000-2008 蝎子 记忆 Nl Rights Reserved 
E-maill: 1amboldleb. com 


< 山 | 岗 
<body> Cdivimid> <div. content> <Form#form1> <table> <tr> <td>(<div】 871 x 439v 256 K/ 5 秒 简体 中 文 (582312)  .: 


8-221 删除 用 户 博 客 的 页 面 设计 效 打 


制作 步骤 如 下 : 

单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 
中 输入 如 图 8-222 所 示 的 参数 。 


名 称 : 
表格 : 
OO 


ser Tl 
typename 


Ser USername 
m5eT- _ password 

E 
user hlng name | 


持 序 | 无 ” 圈 | 天 


8-222” 绑 定 记 录 集 Rs 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs 的 绑 定 ， 把 绑 定 的 Rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-223 所 示 。 


博客 系统 


确定 雪山 际 此 用 户 3 


有 


a 
EL 
bp 于 


{Rs. user username} : {Rs.user blng namej : | 删除 | 


ニャ ーー ニー ニー ニー ニーーー ニ ーーー ニ ーー ーー ニーーー ニ ーー 


8-223 ”插入 字段 


完成 表 早 的 布置 后 ， 要 在 admin del blog.asp 页 面 中 加 入 “服务 大 行为 ”中 的 
“删除 记录 ” 设 定 ， 在 admin_del blog.asp 页 面 中 ， 单 击 “应 用 程序 ”面板 中 的 “服务 融 行 
为 ”标签 中 的 加 号 “+” 投 钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “删除 记录 ”选项 ， 在 打开 的 
“删除 记录 ”对 话 框 中 ， 输 入 参数 值 如 网 8-224 所 示 。 


连接 : 
从 表格 中 出 除 : 
选 职 记录 自 : Rs マ 
唯一 键 列 : 数值 


提交 此 表单 以 删除 :| forml 関 
删除 后 ， 转 到 |: EE 


色 8-224 ” 设 定 “删除 记录 ”对 话 框 


单 击 “ 确 定 ” 按 钮 ， 回 到 编辑 页 面 则 完成 删除 用 户 博 客 页 面 的 设计 ， 效 来 如 
图 8-223 所 示 。 


局 Di:vehap0svadnin_del_bloe. asp (KHTML) ll 


ia connblog. asp style.css 


蝎子 博客 


: ”确定 要 删除 此 用 户 ? 


as 
~ 


Se な ER 
3 : 
s. user_username} : {Rs.user blog name}  : 
ON 


关于 我 /新 闻 公 告 /我 的 好 点 /最 近 访 客 / 最 新 评论 /最 新 留言 


< 
<body> <div#top> 


8-225 admin del blog.asp 的 设计 效果 


全 此 ， 博 铬 系统 的 前 台 与 后 台 的 开发 工作 束 已 经 完成 。 


090 0000 


网 上 开店 以 成 本 低 、 启 动 资金 少 、 交 易 


专业 网 千 平 机 粮 秋 机 枸 
Bah mibiis Eh 


快捷 等 优势 得 到 许多 创业 者 的 青 脉 。 许多 用 车 | = 
户 通过 在 网 上 开店 获得 了 丰厚 的 回报 ， 因 此 二 ea 


在 目前 的 网 络 应 用 中 ， 网 上 购物 系统 已 成 为 本 人 和 NEN EL 
"WP 加 于 礼 上 网 2011 生 市 珊 村 让 
技术 的 热点 。 一 个 购物 系统 必须 拥有 会 员 系 。 直上 e の ee 8 加 | 上 
请 空 网 贡 在 1 去 掉 算 回 昌 活 折 還 っ 0 
统 、 查 询 系统 、 购 物流 程 、 会 员 服 务 、 后 台  。。。。 四 raat 


誠一 El ] RE 
管理 等 功能 模块 。 * 
Ea : 
二 守 本 寺 』 目 
ュー デー | L 


茵 严 平家 学 这 乎 机 ” 旋 痢 平 村 “了 5 平 机 此 国 盯 于 肌 
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本 章 的 实例 效果 


NA 了 到 清光 


教学 重点 


购物 系统 分 析 与 设计 に 


购物 系统 数据 库 设 计 ウ 

首页 设计 它 

商品 展示 动态 页 面 に 

商品 结算 功能 に 

订单 查询 功能 に 

购物 车 后 台 管 理 に 
辅助 页 面 
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如” 购物 系统 分 析 与 设计 


本 章 以 手机 在 线 销售 系统 为 模板 ， 介 绍 网 上 购物 系统 的 开发 与 制作 过 程 。 网 上 购物 系统 


是 一 个 比较 庞大 的 系统 ， 


竺 功能 模块 。 


它 必须 拥有 会 员 系统 、 查 询 系统 、 购 物流 程 、 会 员 服务 和 后 台 管理 


> 系统 功能 分 析 z 


本 章 以 掌 易 通 在 线 手机 销售 系统 为 实例 ， 介 绍 使 用 ASP 编写 购物 系统 的 方法 ， 购 物 系 
统 的 站 页 效果 如 图 9-1 所 示 。 


动 .. 手 机 网 后 。。 時 iGrngnEt Intmrmmt Esplorer 
变 件 证 1) 牙 格 層 ) 查看 让 中 本 nl 工員 Ti 称 助 注 i 


二 


最 址 三) 晤 | htp:JPIET 0. Lf 
2 思 
掌 甸 遂 
EHANGETGONG 


= 苯 冰 中 心 紀 証 厩 緒 服务 这 杖 1 
新 闻 符 鲍 : 


解放 三 这 运 草 南 京 应 赋 涪 成 风云 作 模式 
爱国 尾 在 全 和 宇 原 本 者 上 年 柯 贡 的 江 二 和 隔 
后 国 手 朝 持 读 时 件 团 此 型 | 款 


9-1 开 友 设计 的 购物 系统 衣 页 效果 


对 于 该 网 站 的 功能 说 明 如 下 : 


采取 会 员 制 ， 以 保证 交易 的 安全 性 。 


本 专业 网 插手 机 请 时 机 构 


开发 了 强大 的 搜索 查询 功能 ， 可 以 帮助 用 户 快捷 地 找到 感 兴趣 的 手机 商品 。 


每 


F ゴ 
A 


有 目 己 专用 的 购物 


会 员 购 物流 程 : 浏览 一 将 商品 放 入 购物 车 一 去 收银 人 台 。 

和 车， 可 随时 订购 目 己 中 意 的 商品 并 结账 完成 购物 。 购 物 的 流程 是 指导 购物 车 系统 程 
序 编 写 的 主要 依据 。 

完善 的 会 员 服 务 功能 : 可 随时 查看 账目 明细 、 订 单 明 细 。 


设计 精品 推荐 展示 ， 能 够 显示 企业 近期 所 促销 的 一 些 特 价 商品 。 
后 台 管 理 使 用 本 地 数据 库 ， 保 证 购物 定单 安全 及 时 有 效 ， 并 可 处 理 强 大 的 统计 分 析 


功能 ， 便 于 管理 者 及 时 了 解 财务 状况 和 销售 状况 。 


购物 系统 


前 台 网 上 销售 人 模块。 所谓 前 台 网 上 销售 模块 ， 就 是 指 客 户 在 浏 帘 占 中 所 看 到 的 
直接 与 客户 面对面 的 销售 程序 ， 包 括 : 浏览 商品 、 订 购 商品 、 碍 询 定 购 和 购物 车 等 功能 ， 本 
实例 的 搜索 页 面 如 图 9-2 所 示 。 


动 .. 机 网 牛 . - Bcroroft Jntornot Explorer 
文 位 ) 楠 稀 ほ ) 可 看 中 収 療 A) 工具 0 帮助 人 0 


Ose・ の 回 回 @ PakmoBS EE: 


渚 站 中] 加 buty: 7/127.0.0. 1/protscU/ seuwr ch_r es L aspTsok_classTD=I10I0nme= 国 了 手 机 


通过 系统 功能 的 分 析 ， 访 网络 商店 主要 由 如 下 功能 模块 组 成 : > 


ZHANGETONG 


$ << 近 回 产 品 分 类 
产品 名 存 轩 状态 

x01001 在 第 辕 放 入 风物 在 
第 页 睦 页 上 一 页 1 下 一 页 


图 9-2 ”用户 搜索 界面 效果 


后 台数 据 录 入 模块 。 六 台所 销售 商品 的 所 有 数据 ， 其 来 源 都 是 后 台所 录入 的 数 
据 ， 后 台 的 产品 录入 界面 ， 如 图 9-3 所 示 。 
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后 台数 据 处 理 功 能 模块 。 所 谓 后 台数 据 处 理 ， 是 相对 于 前 台 网 上 销售 模块 而 
言 ， 网 上 销售 的 数据 ， 都 放 在 销售 数据 库 中 ， 对 这 部 分 的 数据 进行 处 理 ， 是 后 台数 据 处 理 模 
块 的 功能 ， 后 台 订 单 处 理 界面 如 图 9-4 所 示 。 


強 . .手机 网 店 .. = 了 icrosoft Internet Explorer 
文件 ) 编辑 于) 查看 QW ”收藏 让) 工具 て ) 帮助 出 ) 
Om OO FEO Pm 次 sw dD A SE 
地 址 0) | 篇 | http:/7127.0.0. 1/admin/order_admin/order_list_markl. asp 

首页 茶 购 中 心 ”关于 我 们 ”新 闻 中 心 。 售后 服务 


服务 条 款 ”订单 查 词 ” 网 站 管理 


新 闻 友 布 管理 
添加 新 闻 
新 闻 管 理 
产品 支 布 管理 
添加 产品 
产品 管理 
后 台 订 单 管理 


订单 列表 
未 处 理 订单 
已 处 理 订单 


已 处 理 客户 订单 列表 : 


订单 号 : 200812156270 日 期 : 2008-12-15 


订购 商品 
zet001 


admin 
测试 的 地 址 
12345678 
12345678 
12@13.com 


标记 为 未 处 理 。 删除 
单价 
1578 


订单 总 额 : 1578 元 


国 回 回回 四 回 


让 
河 
时 
洁 


J Wn 
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用 户 注 册 功 能 模块 。 用 户 并 不 一 定 立 即 购买 东西 ， 可 以 先 注 册 ， 注 册 后 任何 时 
候 都 可 以 来 买 东西 ， 用 户 注 册 的 好 处 在 于 买 完 东 西 后 无 需 再 输入 一 大 堆 个 人 信息 ， 只 和 需 输 入 
账号 和 密码 就 可 以 了 ， 会 员 注 册页 面 如 图 9-5 所 示 。 


EE 。。 一 Nicrosoft Internet Explorer 
立件) ”编辑 字 ) 人 査 者 W) 收藏 入 工具 民 ) 帮助 而) 


Om O 回 回 @ Pm kmd ASE 


地 址 句 ) | http: /i127.0.0. 1/member/registe_ lmow.asp 


专业 网 络 手机 销售 机 构 


六 ; Web mobile shopping a 
@ 「 | "| 3 9 : | 
学 另 通 | “ \W ンー 
し | に ーー 1 
ZHANGETONG リノ ， 关于 我 们 
购物 流程 
物流 配送 
在 线 支付 
ーー 网 站 管理 
购物 车 : 
admin ， 欢 迎 你 
购物 车 中 共有 0 件 商品 
总 价值 0 元 
清空 购物 车 / 去 结算 


采购 中 心 关于 我 们 。 新 闻 中 心 


填写 注册 信息 
填写 注册 信息 前 请 您 先 阅读 服务 条 就 ! 
服务 条 款 
1、 服务 条 款 的 确认 和 接纳 

掌 易 通 的 各 项 服务 的 所 有 权 和 运作 权 归 北京 党 易 通 拥有 。 党 易 通 所 提 
供 的 服务 必须 按照 其 发 布 的 服务 条 款 和 操作 规则 严格 执行 。 用 户 通过 完成 
注册 程序 并 点 击 “ 我 同意 ”按钮 ， 表 示 用 户 接受 掌 易 通 的 所 有 服务 条 款 


搜索 系统 ， 2、 党 易 通 服务 简介 | 
、 移 易 通 运用 自己 的 操作 系统 通过 国际 互联 网 络 为 用 户 提供 各 项 网 络 服 


移 Internet 


密码 : 
在 线 注册 .… 


9-5 会 员 注 册页 面 效 果 


购物 系统 


订单 写 模 块 。 所谓 订 早 写 模 块 ， 束 是 娩 尸 购 关 完 商品 后 ， 系 统 会 日 动 分 配 一 个 


购物 号 人 码 给 客户 ， 以 便 客户 随时 查询 账单 的 处 理 情 况 ， 了 解 现在 货物 的 状态 。 客 户 订购 后 结 
算 中 心 的 页 面 效 果 如 图 9-6 所 示 。 


強 . .手机 网 店 .. - Nicroso ft Internet Explorer | | | > 
立件 ) ”编辑 下 ) 查看 名) 収 薄 ⑭) 工具 ) 帮助 加 ) 
Om O FEG Pm km OSE DEE 


地 址 Ju) | http://127.0.0. 1/shop/ shop. asp 


admin ， 欢 迎 你 ， 

购物 车 中 共有 1 件 商 品 

总 价值 1698 元 购物 车 信息 

清空 购物 车 /去 结算 SE 
购物 车 信息 日 期 : 2008-12-15 

| 

会 员 系统 : 订购 物品 数量 单价 

用 P:[L | zet002 1 1698 

ue: ei 1098 天 

在 线 注 册 .… 说 明 : 在 数量 选择 框 中 可 以 直接 修改 选 购 的 商品 数量 ,修改 为 “0” 表示 不 选 购 此 商品 。 

送 货 信息 

收 货 人 

送 货 地 址 

联系 电话 

手机 

Email 

附 言 


9-6 ”结算 中 心 的 页 和 面 效 末 


se 页 面 设 计 规划 


首先 为 本 购物 系统 创建 一 个 主要 文件 夹 chap09， 然 后 在 其 中 再 创建 多 个 子 文件 夹 ， 最 后 
将 文档 分 关 存 储 到 相应 的 文件 夹 中 。 读 者 可 以 打开 光盘 中 第 9 草 的 素材 , 可以 看 公 敵 点 的 文 
档 结构 和 文件 夹 结构 以 及 将 要 设计 完成 的 结构 如 图 9-7 所 示 : 


fs D:\chap09 
文件 ) 编辑 还 ) 查看 (加 ”收藏 和 ) 工具 民 ) 帮助 而) 


Om OF Pm Bm XX 用 六 XY QO 


a client 
images incoming_img 回 mdb 


member し order_ search 


Service ワ shop 


config. asp 


< 1 


AsP 占 a 志 短 " asp sr ": pa ぎ 刈 asp 
«<> es KE 《上 1 
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下 面 从 站 点 规划 的 文件 夹 及 完成 的 页 面 出 发 ， 分 别 对 需要 设计 的 页 面 的 功能 分 析 如 下 : 

站 点 文件 夹 中 的 4 个 文件 及 功能 分 别 如 下 : 

index.asp: 购物 系统 的 首页 页 面 。 

config.asp: 被 相关 的 动态 页 面 调用 ， 用 来 实现 数据 库 连 接 。 

left menu.asp: 首页 左边 会 员 系 统 及 购物 搜索 功能 组 成 的 动态 页 面 。 单 独 制作 也 是 为 了 
方便 其 他 动态 页 面 的 调用 。 

main menu.asp: 网 站 的 导航 条 ， 对 于 一 个 网 站 来 说 ， 由 于 经 和 常 要 修改 栏目 ， 做 好 的 网 
站 页 和 面 很 多 ， 不 可 能 每 一 个 页面 都 进行 修改 ， 所 以 用 ASP 语言 建立 一 个 单独 的 页 面 ， 通 过 
调用 同一 个 页 面 实现 导航 条 的 制作 ， 这 样 修改 起 来 很 方便 。 

about_us 文件 夹 放置 关于 企业 介绍 的 一 些 内 容 ， 页 面具 有 一 个 。 

about us.asp: 关于 企业 的 内 容 简 介 页 面 。 

admin 文件 夹 放置 的 是 关于 整个 网 站 的 后 台 管 理 文 件 内 容 ， 又 分 别 包 插 了 
news admin、order admin 和 product admin 3 个 子 文件 夹 。 这 个 模块 是 购物 系统 中 的 难点 和 

news admin 文件 夹 是 放置 后 人 台新 闻 管 理 的 页 面 ， 在 前 面 已 经 介绍 过 具体 的 制作 方法 ， 
这 里 就 不 再 介绍 。 

order admin 文件 夹 是 放置 后 台 订 单 处 理 的 一 些 动态 页 面 。 里 面 分 别 放置 了 如 下 5 个 动 
态 页 面 : 

del orderasp: 删除 订单 。 

mark orderasp: 标记 已 处 理 订单 。 

order list.asp: 后 从 客户 订单 列表 。 

order list mark0.asp: 未 处 理 客 户 订 单列 表 。 

order list markl.asp: 已 处 理 客 户 订 单列 表 。 

product admin 文件 夹 用 来 放置 商品 管理 的 页 面 ， 主 要 包括 了 如 下 9 个 动态 页 面 ， 这 是 
购物 的 重点 和 难点 ， 并 涉及 到 上 传 图 片 等 编程 操作 。 

del product.asp: 删除 商品 页 面 。 

insert product.asp: 插入 商品 页 面 。 

product add.asp: 添加 丙 品 信息 页 面 。 

product listasp: 后 台 管理 商品 列表 。 

product modify.asp: 更 新 商品 信息 页 面 。 

update product.asp: 建立 上 传 命 令 动态 页 面 。 

upfile.asp: 上 传 文件 测试 动态 贝 面 。 

upfile.htm: 上 传 图 厂 文 件 议 态 测 试 页 面 。 

upload Sxsoftinc: 上 传 文件 ASP 命令 模版 。 

check admin.asp: 用 于 判断 后 台 登 录 管 理 吴 份 确 认 动 态 文件 。 

client 文件 夹 用 于 放置 客户 中 心 的 内 容 页 面 ， 也 只 有 一 页 。 

client.asp: 制作 与 购物 相关 的 一 些 说 明 。 

imgaes 文件 夹 是 放置 网 站 建设 的 一 些 相 关 图 片 。 


并 :让 庆 汉 购物 系统 


incoming img 文件 夹 用 于 放置 商品 的 图 片 。 
mdb 文件 夹 用 于 放置 网 站 的 Access 数据 库 ， 所 有 的 购物 信息 及 数据 全 放 在 
人 
member 文件 夹 用 于 放置 会 员 的 一 些 相关 页 面 ， 主 要 包括 以 下 4 个 动态 页 而 : (>) 
login.asp: 注册 登录 页 面 。 ， 
logout.asp: 注册 失败 页 面 。 
registe.asp: 填写 注册 信息 页 面 。 
registe know.asp: 注册 需 知 说 明 页 面 。 
news 文件 夹 用 来 放置 网 站 新 闻 中 心 的 一 些 动 态 页 面 ， 主 要 包括 如 下 2 个 动 
态 页 面 : 
news content.asp: 新 闻 细 和 页 面 。 
news listasp: 显示 所 有 新 闻 列 表 页 面 。 
order search 文件 夹 用 来 放置 用 户 订单 查询 的 一 些 动态 页 面 ， 主 要 包括 如 下 两 
个 动态 页面 。 
order search.asp: 用 户 订 单 但 询 输 入 页 耐 。 
your orderasp: 用 户 订 单 得 询 结果 页 面 。 
product 文件 夹 用 于 放置 与 销售 产品 相关 的 页 面 。 主 要 包括 3 个 动态 页 面 。 
all list.asp: 所 有 产品 罗列 负面。 
product.asp: 产品 细 市 页 面 。 
search_result.asp: 产品 搜索 结果 页 面 。 
service 文件 夹 用 于 放置 售后 服务 的 一 些 说 明 页 耐 ， 只 有 一 个 说 明 页 耐 。 
service.asp: 用 来 说 明 售 后 服务 的 页 面 。 
shop 文件 夹 主要 用 于 放置 结算 的 一 些 动态 页 徊 ， 主 要 包括 如 下 5 个 动态 页 面 : 
add2bag.asp: 统计 订单 产品 数量 的 动态 页 面 。 
clear bag.asp: 清除 订单 信息 的 页 面 。 
orderasp: 订单 确认 信息 页 面 。 
order sure.asp: 订单 最 后 确认 页 和 面 。 
shop.asp: 订单 用 户 信 息 确 认 页 耐 。 
EL style 文件 夹 用 于 放置 页 面 的 CSS 文件 。 
index.css 用 于 控制 页 面 属性 的 CSS 样式 文件 。 
从 上 面 的 分 析 统 计 访 网 站 总 共 由 约 45 个 页 面 组 成 ， 几 乎 涉及 到 了 动态 网 站 建设 的 所 有 
的 功能 设计 。 其 中 用 户 注 册 系 统 、 新 闻 系 统 已 经 在 前 面 章节 中 详细 介绍 过 ， 本 章 重 点 介绍 网 
上 
Section_ 


购物 系统 效 据 库 设计 


购物 系统 的 数据 库 设 计 可 以 从 功能 模块 入 手 ， 分 别 创建 不 同 命名 的 数据 天， 命名 的 时 候 
也 要 与 使 用 的 功能 命名 相配 合 ， 方 便 后 面相 关 页 面 设 计 制 作 时 调用 ， 将 数据 库 命名 为 
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shop.mdb， 在 数据 库 中 建立 7 个 不 同 的 数据 表 ， 如 图 9-8 所 示 。 


NT shop : 数据 库 (Access 2000 文件 格式 ) - Microsoft Access 
Na ーー 
| 开始 | 他 是 外部 数 握 数 振 誠 工具 


oA, 总 


| 
| z ロコ 
记录 | 4Y | 和 、 | 调 旦 切换 窗 口误 找 、. 
| 内 


| あめ 窗 体 大 小 ・ 
可 | 格式 文本 | | 排序 和 入 选 | 国人: 


全 警告 ”已 茜 用 了 数据 库 中 的 蔓 些 内 容 | ”选项 ,.. 


9-8 建立 的 数据 库 


对 于 各 数据 表 的 分 析 如 下 : 
产品 表 是 储存 产品 的 相关 信息 表 ， 产 品 表 相 应 的 字段 设置 见 表 9-1， 设 计 的 产 
品 表 如 图 9-9 所 示 。 


字段 名 称 | 数据 类 型 | 说 明 ー 

» 自动 编号 
商品 名 称 文本 

商品 编码 文本 
条 码 文本 

零售 价 文本 
产地 文本 
_ 単位 文 本 
_ 規格 文 本 
产品 图 片 文本 
_ 子 美 別 Ip 文 本 
_ 根 美 別 ID 文本 

在 架 状 态 文本 0 表示 缺 货 ，1 表 示 在 架 

主页 推荐 文本 1 表示 推荐 

商品 说 明 备注 

字段 屋 性 


一 一 | | 字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 坦 看 有 关 字 段 名 称 的 帮助 。 


并 :让 庆 汉 购物 系统 


表 9-1 产品 表 相 应 的 字段 设置 


产品 主 闫 别 表 ， 是 把 商品 进行 分 类 后 的 一 级 类 别 表 。 主 要 设计 了 “ 主 闫 别 
ID” 和 “ 主 类 列 名 称 ” 两 个 字段 名 称 ， 可 以 根据 需要 展示 的 商品 种 类 ， 在 数据 表 中 加 入 商 咒 


的 类 别 ， 如 网 9-10 所 示 。 


转 产品 主 类 别 


字段 尾 性 


说 明 


EE 
字段 大 小 50 
格式 
汰 入 控 結 
标题 
歌 认 什 
有 效 性 规则 
二 次 伍 立 工 
必 填 字段 和 
外 汗 識字 符 率 圭 


索引 

Unicode 压缩 
输入 法 模式 
输入 法 语句 模式 
智能 标记 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 章 看 有 关 字 段 名 称 的 帮助 。 


图 9-10 


建立 产品 主 类 别 表 


图 声 品 主 美 別 


aa 


一 


主 类 别名 称 ・ 門 細 勘 学 義 
国产 手机 

智能 手机 

低位 手 机 

30 手 机 

多 媒体 手机 


| 记录 : 』 


筑 1 項 ( 共 5 項 ) と りほ | 各 


5 | 搜索 


产品 子 关 别 表 ， 是 把 商品 进行 分 类 后 的 二 级 类 别 表 。 主 要 设计 了 “ 子 闫 别 


ID”“ 子 类 别名 称 ” 


据 表 中 加 入 商品 的 名 称 ， 如 图 9-11 所 示 。 


及 “ 主 类 别 也” 三 个 字段 名 称 ， 根 据 需 要 展示 的 详细 商品 种 闪 ， 在 数 


> 


郊 林 天下 CT = 
に コ | 
也 沪 别 各 称 文 本 
主 深 制 1ID 妆 党 
地 占 暑 性 W 
LT 
于 阳 坟 小 sp - 
本 区 一 
時 子 类 别名 称 
笠 旺 
ua ' 国产 手机 
saas 而 经 名作 册 攻 可 二 54 邊 李 生 [生還 宮本 投 智能 手机 
ee Fi 权 可 看 显 帮 基地 起 癌 属 的 本 醒 。 
sa コ a 低位 手 机 
= PE Li se 手相 
Unicode 司 届 雷 
二 人 法 Ta 这 媒体 手机 
METaLrl 亚 畏 尼 , 
上 癌 a 记录 MW“ 筐 1 項 革 5 項 中 トト 目 時 


图 9-11 设计 的 商品 子 类 别 表 
订单 表 是 储存 网 上 用 户 订购 的 相关 信息 表 ， 如 图 9-12 所 示 ， 订 单 表 字 段 设 计 


见 表 9-2 o 
x 
6 > 万 自动 编 导 
订单 ID 文本 生成 一 个 随机 数 来 表示 同一 批 的 订单 
用 户 和 名 文本 
订单 日 期 文本 20080808 表 示 2008 年 8 月 8 号 
是 和 否 处 理 文本 宁 冰 已 处 理 ，0 表 示 未 处 理 
收 货 文本 
送 货 地 址 文本 
联系 电话 文本 
也 村 で で 林 マ 
字段 尾 性 
| ey 
字段 大 长 莹 型 
新 值 着 着 
格式 
标题 
委 引 误 ( 无 重复 ) 
智能 标记 本 
字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
文本 对 齐 に 0 F1 键 可 查看 有 关 字 段 名 称 的 帮助 。 


图 9-12 订单 数据 表 


表 9-2 订单 表 字段 设计 


义 | 字段 名 称 允许 空 字符 串 说 明 
订单 ID 文本 否 生成 一 个 随机 数 来 表示 同一 批 的 订单 
洋货 地 直 


中 


20070808 表示 2007 年 8 月 8 号 
1 表示 已 处 理 ，0 表示 未 处 理 


手机 手机 和 
附 言 255 否 


5 (2 19 章 购物 系统 


订单 产品 表 ， 是 记录 用 户 在 网 上 订购 的 商品 信息 表 ， Cy 线 查 询 订 单 。 
主要 设计 了 “订单 商品 ID 天“ 订单 了 PE 和 “商品 DD” 及 “订购 数量 ”4 个 字段 名 称 ， 如 图 
9-13 所 示 。 


国 订单 产品 > 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 坦 看 有 关 字 段 名 称 的 帮助 。 


图 订单 产品 ee a 4 
-| 订购 数量 
1 


记录 : 《+ | 第 1 项 ( 共 1 项 | + Mm 贱 || 各 无 第 选 句 


9-13 ”设计 的 订单 商品 表 


狐 闻 表 是 用 于 储存 新 闻 的 数据 表 。 主 要 设计 了 了 “新闻 ID”“ 狐 闻 标 题 ” 和 “新 
阁 出 处 “新 闻 内 容 ” “新 闻 图 片 ” 及 “新 闻 日 期 ”6 个 字段 名 称 ， 如 图 9-14 所 示 。 


图 新 闻 表 


EM 
EE FE 


“新 闻 标 题 
“新闻 出 处 
新 闻 内 容 
新 闻 图 片 
新 闻 日 期 


ーーー+ 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 查看 有 关 字 段 名 称 的 帮助 。 


图 9-14 设计 的 新 闻 表 
用 户 表 是 用 于 储存 注册 用 户 的 数据 表 。 主 要 设计 了 “用 户 ID”“ 用 户 名 ”、 
“ 密 人 但 “真实 姓名 “性 别 ”、 66 全 “手机 ”、 66 电子 邮件 ”、 “住址 和 “说 明 22 及 “ 属 
性 ”11 个 字段 名 称 ， 如 图 9-15 所 示 。 
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字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 链 可 查看 有 关 字段 名 称 的 帮助 。 


图 9-15 设计 用 户 表 
上 面 设计 的 数据 表 属 于 较 复 林 的 数据 表 ， 可 以 应 用 于 较 大 的 网 上 购物 系统 。 


自 页 设计 


首先 分 析 一 下 网 络 商 店 站 点 文件 夹 中 的 4 个 文件 。 对 于 一 个 购物 系统 来 说 需要 一 个 主页 
面 供用 户 进 行 注册 ， 搜 索 需 要 采购 的 商品 ， 网 上 浏览 商品 等 操作 。 首 页 index.asp 主要 由 


config.asp、left menu.asp 和 main menu.asp 三 个 页 面 组 而 成 ， 所 以 在 设计 之 前 先 要 完成 这 3 
个 页 面 的 设计 与 分 析 制 作 。 


9.3.1 数据 库 连 车 接 


用 ASP 开发 的 网 站 ， 可 以 通过 config.asp 页 面 实现 网 站 数据 库 的 连接 。 页 面 比较 简单 ， 
束 是 设置 数据 库 连 接 的 基本 命令 ， 如 图 9-16 所 示 。 


nD:\chapodconfie. asp (GrHTWL) la. 
K%@LANGUAGE=" VESCRIPT" CODEPAGE=" 936"%> 


‘a 


2 < 
下 为 数据 库 连 接 代 和 码 
cormstr="DEQ="+server. mappath('"/mdb/ shop. mdb" )+" :DefaultDir=:DRIVER= {Microsoft 上 Access Driver (*.mdbji:" 
a set com=server. createobject ("ADODE. CONNECTION" ) 
6 Co open cormstr 
7T ES 


| 


a 
< 


1K71 秒 简体 中 娘 (GB2312)  .; 


图 9-16 设置 数据 库 连 接 


上 并 "让 斋 汉 购物 系统 


对 于 本 连接 的 程序 说 明 如 下 : 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%> 
<% 

// 以 下 为 数据 库 连接 代码 
connstr="DBQ="+server.mappath("/mdb/shop.mdb")+": 
/设置 DBO 服务 器 物理 路 径 为 /ndb/shop.mdb 
DefaultDir=; DRIVER={Microsoft Access Driver (*.mdb)};" 
/定义 为 Access 数据 库 

set conn=server.createobject("ADODB.CONNECTION") 
/设置 为 ADODB 连接 

conn.open connstr 

/打开 数据 库 


200> 


读者 在 使 用 时 如 果 需 要 更 改 数据 库 名 称 ， 只 需要 将 该 页 面 中 的 shop.mdb 做 相应 的 更 改 
即 可 以 实现 。 


购物 需要 由 一 个 购物 流程 来 引导 用 户 在 网 上 实现 订购 ， 一 般 都 是 通过 用 户 自 身 的 登 
录 、 浏 览 、 定 购 和 结算 这 样 的 流程 来 实现 网 上 购物 的 ， 同 时 需要 加 入 搜索 功能 ， 以 方便 用 
ee ea 


下 面 由 荔 能 分别 分 设计 和 能 1 

首先 分 析 核 心 部 分 ， 购 物 车 系统 ， 该 功 | ーー 

能 模块 完成 后 如 图 9-17 所 示 。 该 购物 车 系统 主要 有 实 1 た GS 

Ah 统计 购物 车 的 商品 ， 统 计 商 品 总 价 .购物 车 /去 结算 浊 、: 
值 ， 清 空 购物 车 ， 链 接 到 结算 功能 页 面 这 几 个 主要 的 。 ”图 9-17 完成 的 购物 车 用 户 系统 


| 
GE?) 此 段 程序 的 代码 如 下 所 示 : 


<table width="80%" border="0" cellspacing="0" cellpadding="2"> 
<tr> 
<td><font color="#FF3300"> 

<% 


if session("user")<>"" then 


response. Write(session("user")) 
else 
response.Write(" 洲 客站 
end if 
00> 
// 这 段 程 序 的 音 思 是 如 果 用 户 登 录 了 则 写 入 用 户 名 ， 如 果 没 有 登录 则 写 游 客 
</font><font color="1A3D05">， 欢 迎 你 ! </font></td> 


注册 及 搜索 ) 


の 
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</tr> 

<tr> 

<td><font color="1A3D05"> 购 物 车 中 共有 <font color="#FF3300"> 
% 
if session("all number")="" then 
0%0> 
0 
<% 
else 
0%0> 
<%=session("all number")%> 
<% 
end if 
0%0> 

/这 段 程序 是 统计 商品 的 总 数量 。 
</font> 件 商品 </font></td> 


</tr> 
<tr> 
<td><font color="1A3D05"> 总 价值 <font color="#FF3300"> 
<% 
if session("all price")="" then 
900>> 
0 
<% 
else 
0%0> 
<%=session("all price")%> 
<% 
end if 
06 テ 
/统计 商品 的 总 价 。 
</fon 人 元 </font></td> 
</tr> 
<tr> 
<td> 
<% 
if session("all number")="" then 
0%0> 


<strong><font color="1A3D05"> 清 空 购物 车 </font></strong> 
<font color="1A3D05">&nbsp;/&nbsp;<strong> 去 结算 </strong></font> 
<% 
else 
90>> 
<a href デ "shop/clear bag.asp"> 
/本 段 程序 是 调用 clear bag.asp 页 面 功能 实现 清空 购物 车 。 
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<strong> 清 空 购物 车 </stong></a>&nbsp:/&nbsp;<a hre 人 "shop/shop.asp"><strong> 去 结算 </strong></a> 


E 半 :证 瑞 记 购物 系统 


/调用 shop.asp 页 面 进行 结算 。 
<% 
end if 
04> 


か の 


</tr> 


</table> 


完成 购物 车 系统 后 设计 用 户 注册 与 登录 系统 ， 该 系统 在 击 面 的 章节 中 已经 详细 
介绍 过 ， 这 里 就 不 再 介绍 ， 完 成 后 的 效果 如 图 9-18 所 示 。 

XI] 分 析 搜 索 功 能 模块 ， 搜 索 功 能 的 设计 与 制作 主要 是 通过 SQL 的 查询 语句 来 实 
现 的 ， 完 成 后 的 搜索 模块 如 图 9-19 所 示 。 


PO 


和 


= 
和 


a 


MCM 
图 9-18 ”用户 登录 系统 图 9-19 ”商品 搜索 功能 模块 
得 询 的 功能 代码 主要 是 和 藤 套 在 单独 的 一 个 表单 FromSearch 之 中 ， 命 令 如 下 : 


<% 
set rs class=server.createobject("adodb.recordset") 
sql="select * from 商品 主 类 别 order by 主 类 别 ID" 
rs class.open Sqlconn,1 ,1 
00>> 
/建立 SQL 查询 语句 ， 通 过 商品 主 类 别 及 主 类 别 ID 来 查询 商品 数据 库 
<table width="84%" border="0" cellspacing="0" cellpadding="3"> 
<form name="FromSearch" method="post" action="product/search result.asp" onSubmit="return check()"> 
/提交 后 由 search result.asp 页 面 显 示 查 询 效果 
<tr> 
<td><img src="/images/Spacer.gif" width="1" height="6"></td> 
</tr> 
<tr> 
<td><font color="#FFFFFF"> 关键 词 : </font> </td> 
</tr> 
<tr> 


<td><input name="search key" type="text" class="inputl" size="26"> 
/设置 搜索 关键 词 文本 域 

<7td> 

</tr> 

<tr> 

<td><font color="#FFFFFF"> 类 ” 别 : </font></td> 

</tr> 
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<tr> 
<td> 
<select name="search class" class="inputl"> 
<option value="" selected>----- 所 有 和 商品 和英 列 -----<7option> 
<%6for 1=1 to rs class.RecordCount-1%> 


<option value="<%=rs class(" 主 美 列 ID")%>"><%=rs_class(" 主 类 别名 称 ")%></option> 


<% 
ifrs class.eof then 
exit for 
end if 
rs class.movenext 
next 
rs class.MoveFirst ' 把 记录 集 游标 移 到 第 一 条 记录 
00> 
</Select> 
/通过 商品 主 类 别 ID 和 主 类 别名 称 进 分 类 查询 
</td> 
</tr> 


tr valign="middle"> 
<td><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td><input name="imageField2" type="image" src="/images/index search bt.gif” width="57" 
height="21" border="0"></td> 
</tr> 
</table></td> 
</tr> 
<tr> 
<td><img src="/1mages/Spacer.gif" width="1" height="6"></td> 
</tr> 


</form> 


下 于 于 创建 导航 条 | 


这 里 将 使 用 ASP 语言 建立 导航 条 ， 完 成 后 的 代码 如 下 : 


<% 

if session("user prop")="admin" then 

main menu="<a hre 伍 "> 首页 </a> | 

<a hre 仁 7productall list.asp 人 > 采购 中 心 </a> | 

<a href='/about_us/about us.asp 人 > 关于 我 们 </a> | 

<a hre 仁 7news/news list.asp> 新 闻 中 心 </a> | 

<a href='/client/client.asp 人 > 售后 服务 </a> | 

<a href=/service/service.asp' > 服务 条 款 </a> ! 

<a hre 仁 7order search/order search.asp 人 > 订单 查询 </a> | 


购物 系统 


<a href='/admin/news admin/news add.asp> 网 站 管理 </a>" 
/如 果 登 录用 户 是 admin 则 显示 的 导航 内 容 
else /否则 导航 条 显示 如 下 的 内 容 

main menu="<a hre 伟 "> 首页 </a> | 

<a hre 仁 7productall list.asp 人 > 采购 中 心 </a> | 
<a href=/about us/about us.asp 作 关于 我 们 </a> 
<a hre 仁 7news/news list.asp 人 > 新 闻 中 心 </a> | 
<a hre 人 f=/client/client.asp> 售 后 服务 </a> | 

<a href=/service/service.asp' > 服务 条 款 </a> | 
<a href=/order search/order search.asp> 订 单 查询 </a>" 
end 1f 

00> 


这 个 页 面 设 置 了 导航 条 的 内 容 及 链接 情况 ， 并 进行 了 一 个 条 件 选 择 显示 ， 如 果 登 录 者 是 
admin 则 多 显示 “网 站 管理 ”功能 链接 ， 方 便 管 理 者 进入 后 人 台 进 行 管 理 ， 如 果 不 是 后 人 台 管 理 
者 则 显示 正常 的 导航 链接 ， 创 建 的 效果 如 图 9-20 所 示 。 


| DD: vehap0gmain menn. asp [XHTYL) - 口 总 


< 入 

if sessinnl User Tn 』 ニ admin” then 

main _ mem" “a href=" /index. asp > 自 軸 ama> | Ya href=’ /product/all_ 1ist, asp > 采购 中 心 
Aa | a href= /about_us/about_us. asp > 关于 我 们 《aa | < 

href= /newa/news_list. asp > 新 闻 中 心 “ay | href= /clientrclient. asp » 售 后 服务/ay 
| <a href=’/ servicer service, SD > 服务 条 款 ae 1 <a 

href=" /order_ saarch/nrder search. asp > 单 查 各:7a> | <a 

hret=” /admin/news_admin/news_add. asp > 网 站 管理 */a>" 

ge 

ma1TL mernu=" “a href= ”imndex, asp ?首页 《a | <a href=’ “product/ all_ list. asp > 于 网 中 心 
“ay | a href=’ /about -usy about_ Us. asp > 关于 我 们 &7 aa | <a 

href=" /news/news_list. asp "> 新 闻 中 心 “ar | Ya href= client client. asp » 售 后 服 备 /ay 
| “a href=’/ servwicer service. asp’ > 服务 条 款 a 1 で ョ 

href=’ /order_ searchy border searrh.asn > 订单 查 疝 < a>" 

End 1f 

入 学 


1 Ki 税 価 必 中立 B2312) 


图 9-20 创建 导航 条 页 面 


index.asp 为 购物 系统 首页 页 面 ， 用 户 通 过 在 正 栏 中 输入 网 站 地 址 后 直接 可 以 打开 的 页 
面 ， 首 页 的 设计 分 析 如 下 : 

把 光盘 中 素材 chap09 文件 夹 中 的 网 上 购物 系统 复制 到 本 地 计算 机 便 稚 上， 由 
前 面 所 学 知识 创建 本 地 站 点 chap09， 并 设置 主 浏览 页 面 。 


二 デ 」 
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双击 “文件 ”面板 中 的 index.asp 页 面 ， 打 开 的 页 面 效果 如 图 9-21 所 示 。 


DW 区 人 (Fp) 画 揚 TE) 置 看 性) 政大 全] 邮政 库 ) 邊 式 可 ) 章 党 全 呈 直 臣 】 面 口 大 』 古 动 品 i ”| 


BAS nig wap i 


a 
cha LnSm。 at 


感 記 六 本 (Emma Ul Feit 
琴 赴 量 性 imtisu rme 
陸軍 時 欄 tk. 二 4 本 

上 1 | し 上 時 


ee 


| rimmL| 間 素 yi キ 回 EE “| 和 昌 J 和 | 
本 ee | mmn キ | 要 _ 宣 轧 时 六 
.| "rl 二 直上 


9-21 设计 好 的 index.asp 页 面 
该 页 面 的 代码 比较 长 ， 这 里 把 实现 功能 的 一 些 重要 ASP 命令 列 出 说 明 。 在 导 
航 条 调 入 如 图 9-22 所 示 的 位 置 加 入 ASP 命令 如 下 : 
2 Ep Ce = | 


专业 网 络 手 机 销售 机 构 


Wgh mobile shopping At 


 G) 峰 易 Cs 
“ ZHANGETONG 甘于 我们 . 
购物 流程 
\ 物流 配送 


在 线 云 付 


9-22 ”导航 条 调 入 位 置 


ASP 命令 说 明 : 
<%=main Imenu%o> 
/调用 main menu.asp 
左辺 的 内 容 和 left menu.asp 页面 功能 是 一 样 的 ， 这 里 束 不 再 介绍 ， 中 间 是 由 
新 闻 系 统 和 精品 推荐 及 产品 分 类 功能 模块 组 成 ， 如 图 9-23 所 示 。 


购物 系统 


图 9-23 ”商品 展示 模块 


产品 分 类 模块 应 用 了 ASP 中 的 for 循环 命令 快速 建立 了 所 有 商品 的 展示 功能 ， 
该 段 动态 命令 如 下 : 


<table width="90%" border="0" cellpadding="S" cellspacing="0" class= fenlel > 
<% 

if (rs class.RecordCount mod 5)=0 then 

line=Int(rs class.RecordCoun1/S) 


else 
line=Int(rs class.RecordCoun175) 填 1 
end 1f 
for 1=1 to line 
if (1 mod 2)<>0 then 
0%0> 
/设置 商品 分 类 显示 行 数 为 5 
<tr> 
<td bgcolor="#FFFFFF"> 
<% 
for k=1 to 5 
ifrs class.eof then 
exit for 
else 
0%0> 


// 如 果 显 示 了 所 有 的 记录 则 关闭 会 询 

<a href="product/all list.asp"><%=rs_class(" 主 类 别名 称 ")%></a><img src="/images/Spacer.gif" 
width="6" height="1"> 

// 单 击 商品 类 别名 称 连 接 到 all list.asp 显示 全 部 商品 内 容 页 面 

<% 


rs class.MoveNext 
end 1f 


next 
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00>> 
</td> 
</tr> 

<% 
end if 
if (1 mod 2)=0 then 
0 る > 

<tr> 

<td> 

<% for k=1 to 5 
ifrs class.eof then 

exit for 
else 
00>> 


<a href="product/all list.asp"><%=rs_class(" 主 类 别名 称 ")%></a><img src="/images/Spacer.gif" 
width="6" height="1"> 

<% 
rs class.MoveNext 
end 1f 

next 

0%0> 
</td> 
</tr> 

<% 

end 1f 
next 
0%0> 


</table> 
网 上 购物 系统 的 首页 分 析 结 束 ， 如 果 需 要 快速 建立 购物 系统 的 首页 可 以 直接 参 
考 光 盘 中 已 完成 的 页 面 ， 得 看 代码 ， 可 以 快速 完成 购物 系统 首页 的 设计 与 制作 。 


94 商品 展示 动态 页 面 


product 文件 夹 用 于 放置 与 销售 商品 相关 的 页 面 。 主 要 包括 所 有 商品 罗列 页 面 
all listasp、 商 品 细节 页 面 product.asp 和 商品 搜索 结果 页 面 search result.asp。 下面 次 分 別 介 
绍 这 些 页 面 的 设计 。 


> 了 商品 罗列 页 面 


单 击 导航 条 中 的 “采购 中 心 ” 或 单 击 首页 中 的 “商品 分 类 ”中 的 商品 内 容 即 可 链接 到 的 
页 面 ， 主 要 用 于 显示 数据 库 中 的 所 有 商品 。 
首先 完成 静态 页 面 的 设计 ， 该 页 面 的 核心 部 分 在 “商品 选 购 ” 中 商品 二 级 分 类 


的 显示 ， 其 他 部 分 功能 在 肯 页 设计 中 已 经 介绍 过 ， 


悦 . .手机 网 店 .. 一 Microsoft Internet Explorer 国 |EjlB3 
文件 下) 编辑 区 ) 查看) ”收藏 入 工具 g) 娠 助 ⑪ 入 


Ge・ の 回 回 @ Pm LS ae EE 


地 址 甸 ) | http://127.0.0. 1/product/all_list. asp v | 蕊 了 转 到 | 


向 荔 另 通 1 ws コ 


ZHANGETONG ーー 
关于 我 们 


购物 流程 
物流 配送 
在 线 支 付 
首页 ”采购 中 心 ”关于 我 们 。 新 闻 中 心 。 售后 服务 
购物 车 : 
Im | ™ 
游客 ， 欢 迎 你 9 記 品 选 购 


购物 车 中 共有 0 件 商品 
总 价值 0 元 
清空 购物 车 /去 结算 


密码 : 


在 线 注册 .… 


搜索 系统 ， 


| ---- 产 品类 别 


Tnnwrinht FTnna-3nnao 0 コロ テー ロキ rnrn Bl Pinhte Pocorrodn 


夫 Tnternet 
9-24 ”设计 的 商品 罗列 页 面 


主要 核心 部 分 代码 如 下 所 示 : 


<table width="90%" border="0" cellpadding="S" cellspacing="0" class= fenlel "> 

<% 
for i=1 to rs.RecordCount 

0%0> 
/设置 记录 集 计算 循环 
<tr> 
<td width="79%" bgcolor="#FFFFFF"><strong><%=rs(" 主 类 别名 称 ")%></strong></td> 
/显示 主 类 别名 称 
<td width="21%" align="right" bgcolor="#FFFFFF"><a href="all listasp 喧 返回 总 分 类 </a>&nbsp; 
&nbsp; &nbsp;&nbsp;</td> 

</tr> 


<tr> 
<td colspan="2" class="line"> 
<% 
for J=1 to rs sub.RecordCount 
itrs sub.eof then 
rs sub.MoveFirst 
end if 
ifCIntrs sub(" 主 类 别 ID"))=CInt(rs(" 主 类 别 ID")) then 
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%> <a href="search result.asp?sub classID=<%=rs Sub(" 子 类 别 ID")%>&name=<%=rs sub(" 子 
类 别名 称 ")%>"> 
<%=rs_sub(" 子 类 别名 称 ")%></a> <% 
end 1f 
rs sub.MoveNext 


next 
00> 
/该 段 程序 是 在 页 面 中 显示 所 有 子 类 别名 称 的 代 但 
</td> 
</tr> 
<% 


rs.MoveNext 
next 
00> 


</table> 


在 完成 的 动态 页 面 中 ,，“ 产 品 选 购 ” 说 明文 学 下 方 共有 4 个 ASP 程序 图 标 ， 如 
图 9-25 所 示 ， 每 个 ASP 图 标 束 是 加 入 步 又 (2) 中 <%..%> 符号 之 间 的 4 名 不同 的 ASP 程序 。 


ED: vehap0g\productvall_list.asp m1 


HA config.asp main menu.asp index.css left menu.asp Fp 
a 一 人 Fr 


专业 网 络 手机 销售 机 构 


7 x Web mobile shopping a 
学 号 到 // 下 阁 ここ 
ZHANGETONG J | ER 人 下 和 1 
> 关于 我 们 


购物 流程 
物流 配送 


在 线 支付 


: i 0 
: :{Session. all_number} | しま 


GQ 100% vi864 x443v 74KA 2 秒 | 简体 中 文 (GB2312) 


购物 系统 中 所 有 商品 都 是 需要 显示 详细 信息 的 ， 接 下 来 束 要 设计 商品 细节 页 面 
productasp。 细 贡 页 面 用 于 显示 商品 所 有 的 详细 信息 包括 商品 价格 、 商 品 产地 、 ne 
商品 图 片 等 ， 同 时 要 显示 是 否 在 架 (是否 还 有 商品 )， 放 入 购物 车 等 功能 。 

由 所 需要 建立 的 功能 出 发 ， 可 以 建立 如 图 9-26 所 示 的 动态 页 面 ， 页 面 中 一 个 
ASP 代码 图 标 代表 加 入 动态 命令 实现 该 功能 。 


购物 系统 


で 放 入 购物 车 8 。。。 贿 折 其 ! 此 商品 时 贷 f : 


抱歉 ! 
本 商品 暂时 没有 图 片 ! 


|N 1 Q 1OOX v864 x 482v| 80 /2 秒 | 简体 中 文 (GB2312)| 


图 9-26 完成 的 设计 页 面 
下 和 面 对 该 模块 的 命令 分 析 如 下 : 


<table width="90%" border="0" cellpadding="5" cellspacing="0" class= fenlel "> 

<tr> 

<td width="44%" bgcolor="#FFFFFF"><strong> 商 品 编码 : <%=rs(" 商 品 编 码 ")%></strong></td> 
<td width="29%" bgcolor="#FFFFFF"> 


< 
ifrs(" 在 染 状 态 ")=0 then 
else 

00> 


<a hre 仁 "7shop/add2bag.asp7productID=<%=rs(" 商 品 ID")%>"><img src="../images/index dinggou.gif' 
width="84" height="16" border="0"></a> 


<% 

end 1f 

0%0> 

// 如 果 商 品 在 架 ， 单 击 放 入 购物 车 连接 add2bag.asp 页 面 实现 购物 功能 
</td> 

<td width="27%" align="right" bgcolor="#FFFFFF"> 
<% 
ifrs(" 在 架 状 态 ")=0 then 

0%0> 

<font color="#FF6600"> 抱 款 ! 此 商品 缺 货 ! </font> 
<% 
else 
0%0> 


font color="#FF6600"> 在 架 </font> 
% 
end if 
04> 
// 如 果 商 品 在 染 状 态 定 义 值 为 0， 则 显示 “抱歉 ! 此 商品 缺 货 ! ” 
</td> 
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</tr> 
<tr valign="top"> 
<td colspan="3" class="line"><table width="100%" border="0" cellpadding="3" cellspacing="0" class= 


"rightA"> 


< 人 tr> 
<td width="5%"><img src="../images/index title.gif" width="19" height="12"></td> 
<td><font color="#427012"><strong> 商 品名 称 : </strong></font> 
<%=rs(" 商 品名 称 ")%>// 显 示 商 品名 称 
</td> 
</tr> 
<tr> 
<td bgcolor="#FFFFFF"><1img src="../images/index title.gif" width="19" height="12"></td> 
<td bgcolor="#FFFFFF"><font color='#427012"><strong> 商 品 售 价 ;</strong></font><%=rs(" 零 售 
价 )%> 元 /显示 商品 价格 
</td> 
</tr> 


<tr> 

<td><img src="../images/index title.gif" width="19" height="12"></td> 

<td><font color="#427012"><strong> 障 上品 单位 : </strong></font><%=rs(" 和 单位 ")%>// 显 示 阐 品 蛙 
位 </td> 

</tr> 

<tr> 

<td bgcolor="#FFFFFF"><img sre="../images/index title.gif" width="19" height="12"></td> 

<td bgcolor="#FFFFFF"><font color='"#427012"><strong> 商 品 产地 : </strong></font><%=rs(" 产 
地 "9%>// 显 示 丙 品 产地 </td> 

</tr> 

<tr> 

<td class="fenlei"><img src="../images/index title.gif" width="19" height="12"></td> 

<td><font color="#427012"><strong> 商品 更 明 : </strong></font><%=rs(" 商 品 说 明 ")%>/ 显 示 商 
品 说 明 </td> 

</tr> 
<tr> 

<td class="fenlei"><1img src="../images/index title.gif" width="19" height="12"></td> 

<td><font color="#427012"><strong> 障 上 蜗 图 片 : </strong></font></td> 

</tr> 

<tr> 
<td class="fenlei">&nbsp;</td> 
<td valign="top"> 


<% 
ifrs(" 商 品 图 万 )="" then 
00> 

<img src="../incoming img/no photo.glif width="500" height="186"> 
<% 

else 

0%0> 

<img src="../incoming img/<%=rs(" 障 总 图 片 ”)%>"> 

<% 


end if 


04> 

/显示 商品 图 片 
</td> 

</tr> 

<tr> 


<td colspan="2" class="fenlei"><img src="../images/Spacer.gif" width="1" height="5"></td> 
</tr> 


</table></td> 
</tr> 
</table> 


商品 细节 页 的 设计 不 是 一 成 不 变 的 ， 该 页 面 实际 是 显示 记录 集 的 页 面 ， 在 实际 


操作 中 需要 建立 数据 库 连 接 ， 建 立 但 询 记 录 集 ， 最 后 绑 定 想 要 显示 的 字段 ， 则 可 以 完成 商品 
细 厂 页 的 设计 。 


過当 商品 搜索 结果 页 面 ー 


在 首页 中 有 一 个 商品 搜索 功能 栏 ， 通 过 和 输入 搜索 的 商品 ， 单 击 搜索 撤 钮 打开 的 页 面 就 是 
这 个 商品 搜索 结 琳 页 面 search resultasp。 该 页 面包 括 的 功能 有 由 搜索 页 传递 过 来 的 字段 搜索 
数据 库 中 的 数据 并 显示 该 商品 ， 为 了 方便 购物 在 找到 的 显示 商品 中 还 需要 设置 商品 的 名 称 、 
报价 、 在 染 状 态 ， 同 时 要 加 入 购物 车 功能 ， 在 制作 搜索 结 末 页 的 时 候 还 需要 卷 虑 到 一 个 问 
题 ， 那 殉 是 很 可 能 在 搜索 的 字段 当中 会 有 很 多 商品 相似 ， 如 输入 “zet”， 则 所 有 数据 中 市 
“zet” 了 学 段 的 商品 邦 会 列 在 该 页面 ， 所 以 要 创建 寻 航 条 还 有 记录 统计 等 功能 。 

由 上 和 面 的 功能 分 析出 及 ， 设 计 好 的 商品 搜索 结果 页 面 如 图 9-27 所 示 。 


引 . .手机 网 店 .. icrosoft Internet Explorer 
立件 び ) 端 缉 在 )】 查看 加 业 家 内 ) 工具 立 ) 税 助 ①) 


On ©O EO Pm ma OL Se JTS 


地 址 站) http' /11/127 DO lfprodoct/ saarch _ rerlt Ap 


党 多 通 


ZHANGETONG 


首 贝 ”来 购 中 心 部 闻 中 心 。 售 语 服务 


购 多 车 : 


游客 ， 欢 迎 你 ? 产品 选 购 


购物 车 中 共有 0 持 商 品 


和民 0 元 产品 列表 
清空 攀 物 / 大 站 区 


此 摔 索 的 关键 词 是 : zet “< 返回 产品 分 类 
介し し {Il ym001 守 直入 移 生 キ 
に ym1002 宮 前 入 购物 证 
[区 条 ] 二 tt 册 zel003 に 
搜索 系统 ， zal004 トー・ 喜人 入 购物 车 


1 幕 1 页 上 污 1 页 上 一 页 /1 下 一 页 
| 


TTP 
| 搜索 | 


PFW w 


Copyriont @ 20052009 30zet com All Rights Reserved 


图 9-27 搜索 的 实际 结果 


SS 


本 页 面相 关 的 程序 分 析 如 下 : 


<table width="100%" border="0" cellspacing="0" cellpadding="0"> 

<tr> 

<td>&nbsp;</td> 

</tr> 

<tr> 

<td><img src="../images/index pro011.gif" width="573" height="41"></td> 

</tr> 

<tr> 

<td ahgn="center" valign="top" background="../images/index pro03.g1f"><table 
border="0" cellpadding="S" cellspacing="0" class="fenle1"> 


<tr> 

<td width="77%" bgcolor="#FFFFFF"> 
<% 
it Request("search key")<>"" then 
0%0> 


<strong> 您 搜索 的 关键 词 是 :</strong><font color='"#FF3300">&nbsp; 
<%=Request("search key")%></font> 

<% 

else 

900> 

<strong><%=Request("name")%>: </strong> 

<% 

end if 

04> 

/在 搜索 的 关键 词 后 面 显示 前 面 输入 搜索 的 阶段 变量 即 搜索 的 名 称 值 
</td> 
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width="90%" 


<td width="23%" bgcolor="#FFFFFF"><a href="all listasp">&lt&lt 返 回 商品 分 类 </a></td> 


</tr> 
</table> 
<table width="90%" border="0" cellpadding="0" cellspacing="0" > 
<tr> 
<td><img src="../images/Spacer. gif" width="1" height="3"></td> 
</tr> 
</table> 
<table width="90%" border="0" cellpadding="5" cellspacing="0" class="fenlei"> 
<tr> 
<td width="48%" bgcolor="#FFFFFF"><strong> 商 品名 </strong></td> 
<td width="17%" bgcolor="#FFFFFF"><strong> 报 价 </strong></td> 
<td width="16%" bgcolor="#FFFFFF"><strone> 在 染 状 态 </strong></td> 
<td width="19%" bgcolor="#FFFFFF">&nbsp;</td> 
</tr> 
<% 
if rs.recordcount<>0 then 
for 1=1 to pagesize 
if rs.eof then 


区 物 系 銃 


exit for 
end if 
04> 


<% " 
if (1 mod 2)=0 then > 


90>> 
<tr bgcolor="#EBEBEB"> 
<% 
end if 
90>> 
/显示 所 有 的 搜索 结 
<td><a href="product.asp?productID=<%=rs(" 商 品 ID")%>" target=" blank"><%=rs(" 商 品名 称 ")%> 
</a></td> 
<td><%=rs(" 零 售 价 )%></td> 
/通过 商品 ID 打开 商品 名 称 
<td> 
<% 
ifrs(" 在 架 状 态 ")=0 then 


response.Write(" 缺 贷 " 


else 
response. Write(" 在 架 ") 

end if 

04> 
// 显 示 商 品 是 否 在 涤 或 者 缺 贷 
</td> 


<td><font color="1A3D05"><a href="/shop/add2bag.asp?productID=<%=rs(" 商 品 ID")%>"><img 
src="../images/index dinggou.gif" width="84" height="16" border="0"></a></font></td> 
</tr> 
<% 
rs.MoveNext 
next 
else 
0%0> 
<tr bgcolor="#EBEBEB"> 
<td colspan="4"><font color="#FF3300"> 抱 妆 ! 您 选择 的 分 类 暂时 没有 货物 ， 请 您 电话 与 我 们 联 
系 ! </font></td> 
</tr> 
<% 
end if 


rs.close 


set rs=nothing 
conn.close 
set conn=nothing 
0%0> 
</table> 
<table width="90%" border="0" cellpadding="8" cellspacing="0" class="fenle1"> 


Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


<tr> 
<td width="359%0"> 第 <%=page%> 页 / 共 <%=pageall%> 页 /统计 搜索 总 数 </td> 
<td width="32%">&nbsp;</td> 
<td width="33%" align="right"> 
<%If Cint(page-1)<=0 then 
response.write "上 一 页 " 
elSe%o> 
<ahref="search result.asp?page=<%=page-1%>&name=<%=Request("name")%>&sub_classID= 
<%=Request("sub_classID")%>&search key=<%=request("search key")%>&search class=<%=request 
("search class")%>"> 上 一 页 </a> 
<%end 1f%> 
&nbsp;/&nbsp; 
<%olf Cint(page+l)>Cint(pageall) then 
response.write "下 一 页 " 
else%> 
<ahref="search result.asp?page=<%=page+1%>&name=<%=Request( "name")%>&sub_classID=<%=R 
equest("sub classID")%>&search key=<%=request("search key")%>&search class=<%=request("search cla 
ss")%>"> 下 一 页 </a> 
<%end if %> 
</td> 
</tr> 
</table></td> 
</tr> 
<tr> 
<td><img src="../images/index pro02.gif" width="573" height="46"></td> 
</tr> 


</table> 


到 这 里 就 完成 了 商品 相关 动态 负面 的 设计 ， 可 以 实现 商品 的 展示 功能 。 


_Section_ 


强 商品 结算 功能 


购物 车 的 主要 功能 就 是 进行 商品 结 得， 通过 这 个 功能 用 户 在 选择 了 目 己 豆 欢 的 商品 后 可 
以 通过 网 络 确认 所 需要 的 商品 ， 输 入 联系 办 法 ， 所 交 后 写 入 数据 库 方便 网 站 定理 者 进行 售后 
服务 ， 这 也 是 购物 车 系统 的 核心 功能 。 


9.5.1 统计 名 时 
Add2bag.asp 页 面 在 前 面 的 代码 中 经 常 应 用 到 ， 就 是 单 击 “ 放 入 购物 车 ”图 标 按钮 后 


祁 调 用 该 页 面 ， 主 要 是 实现 统计 订单 数量 的 功能 页 面 。 访 页面 完 全 是 ASP 代码 ， 如 图 9-28 
所 示 。 


“1--#include file=". 
<% 
productTD=renuest (“productID") 
Set rs=server. createobject ("adodb. recordset") 
sql="select * from 产品 表 where 产品 ID="&productID&”order by 产品 ID” 
rs. open sql, corm, 1, 1 
if rs.recordcount<>0 then 

session("all_mumber" )=session("all_rmumber" )+1 


./ config. asp 一 -> 


sessiont "product"&sessiont"all_number"))=productID 
session("all_ nrice")=sess1am("a11 nrice")+CDb1(rs(" 等 隻 件 ")) 
end if 
rs. close 
set rs=nothing 
response. Redirect ("../index. asp”) 


for i=1 to CInt (session("all_number" ) ) 
六 > 

<W=session("product"&i)&" <br>"%> 

< 六 

next 

闹 > 


6 有 辐 国 [四 瞧 >= 
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9-28 add2bag.asp 页 面 的 设计 
代码 分 析 如 下 : 


<!--#include file="../config.asp"--> 

/调用 config.asp 人 确认 数据 库 连 接 

<% 

productID=request("productID") 

// 定 义 阶段 变量 productID 

set rs=server.createobject("adodb.recordset") 

/创建 记录 集 

sq="select * from 产品 表 where 产品 ID="&productID&" order by 产品 ID" 

/用 sql 查询 功能 通过 产品 ID 与 productID 核对 

rs.open sql,conn,1,1 

if rs.recordcount<>0 then 
session("all number")=session("all number") 十 1 

/通过 session 记录 放 入 的 购物 篮 产品 的 总 个 数 
session("product"&session("all number"))=productID 
session("all price")=session("all price")+CDbl(rs(" 零 售 价 ")) 

end 1f 

rs.close 

set rs=nothing 

response.Redirect(request.serverVariables("Http REFERER")) 

0%0> 

// 如 果 是 定购 则 产品 的 总 个 数 加 1， 购物 总 价 加 入 刚 定 购 产 品 的 零售 价 

<% 

for 1=1 to CInt(session("all number")) 

0%0> 

<%=session("product"&1)&"<br>"%> 

<% 

next 

0%0> 


代码 说 明 : 
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session 在 Web 技术 中 占有 非常 重要 的 位 置 。 由 于 网 页 是 一 种 无 状态 的 连接 程序 ， 因 此 
无 法 得 知 用 户 的 浏览 状态 。 因 此 必须 通过 session 记录 用 户 的 有 关 人 信息， 以 供用 户 再 次 以 此 
身份 对 Web 服务 器 提供 要 求 。 


”清除 订单 


clear bag.asp 页 面 是 清除 订单 信息 的 页 面 ， 通 过 单 击 文字 “清空 ”能 够 调用 clear bag.asp 
页 面 ， 通 过 里 面 的 命令 清空 购物 车 中 的 数据 统计 ， 设 计 的 asp 命令 如 图 9-29 所 示 。 


名 


HiYchlanndtshlnntclear bag. asp TKHTML) ~- 口 宗 


1 で を LMMETLGE= "WESEETPT"T CODEPAGE="936" 和 4» 
由 に 
USEL=SESSlOn LSELE ) 
USBEL LYDE=3SESSTLOI USEL prop"™) 
3eE33i0n.Contents.Remowvedllii 
3E331i0n1"U3er")=uU3er 
SESSinnhl "User prop")=u3er type 
EEgBDIABG REHLEEGEIFBGLUEBE。 servervariablesti"Http PEFEPRER™)) 
に 


1 1 和 Unicode MTF- 


图 9-29 clear bag.asp 负面 
清除 订单 的 代码 如 下 : 


<%QWLANGUAGE="VBSCRIPT" CODEPAGE="936"%> 
<% 

user=session( "user") 

user type=session("user prop") 
session.Contents.RemoveAll() 

session("user")=user 

session("user prop")=user type 
response.Redirect(request.serverVariables("Http REFERER")) 
900> 


/通过 RemoveAlO 命 令 实现 清空 session 中 的 记录 


sR 用 户 信 息 确认 订 早 


用 户 登 录 后 选择 商品 放 入 购物 车 ， 单 击 首 页 上 的 “去 结算 ”按钮 ， 则 打开 用 户 信 息 订 单 
确认 页 面 shop.asp， 访 页 面 主要 用 于 显示 选择 的 购物 商品 数量 及 总 价 ， 需 要 设置 输入 “ 送 货 
信息 ”功能 ， 然 后 单 击 “ 继 续 ”按钮 把 输入 的 信息 存 入 数据 库 中 ， 打 开 订 音信 息 确 认 页 面 
orderasp。 访 页 面 完 成 后 的 效果 如 图 9-30 所 示 。 从 功能 上 可 以 看 出 该 页 面 的 功能 有 点 类 似 于 
留言 板 的 功能 。 只 不 过 多 了 订单 商品 统计 功能 。 订 单 商品 的 统计 功能 和 add2bag.asp 页 面 的 


统计 功能 一 样 ， 所 以 本 页 的 程序 就 不 再 分 析 介 绍 ， 读 者 可 目 行 打开 本 书 配套 光盘 中 的 该 页 
面 ， 对 代码 进行 浏览 分 析 。 
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图 9-30 订单 信息 确认 页 面 效 果 


so 订单 确认 信息 


单 击 shop.asp 页 面 中 的 “结算 ”按钮 后 打开 orderasp 订单 确认 页 面 ， 该 页 面 同 shop 页 
面 的 结构 ， 在 送 货 信息 中 显示 了 上 一 页 中 输入 的 送 货 详细 信息 ， NE 
板 功 能 ， 设 置 的 结果 如 图 9-31 所 示 。 设 计 命 令 前 面 已 全 部 介绍 过 这 里 不 再 介 


人 msp = 百叶 
A on tp mn mat ip dt, HE 


EDU Pl 300 元 名 错 谨 胃 上 门 。 
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9-31 订单 确认 页 面 
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:IN 订单 最 后 确认 
单 击 订单 确认 信息 页 面 orderasp 中 的 “生成 订单 ”按钮 ， 融 可 以 打开 order sure.asp 页 


面 ， 该 页面 的 功能 是 在 订单 号 入 数据 库 后 弹出 的 完成 购物 页 面 ， 访 页面 的 设计 同 orderasp, 
上 只 是 减少 了 “ 送 货 信 息 ” 的 内 容 ， 共 体 的 制作 不 再 介绍 ， 结 朱 如 网 9-32 所 示 。 


四 ichap03kshontorder_sure.asp = lt 


UTA config.asp main menu. asp index.css left menu.asp 


专业 网 络 手机 销售 机 构 


‘4 Web mobile shopping / 
学 另 通 ” /// ンー 
ZHANGETONG | a 1 

< 关于 我 们 

购物 流程 

物流 配送 


在 线 支付 


1 a AT 
: :session. all_number 器 件 : : 


tg : 
: 清空 购物 车 /去 结算 渭 。 ， : 


mG 100% voigx 582v 77TX7 2 秒 简体 中 文 (GB2312) 


9-32 ”完成 购物 订单 效果 


EX。 订单 查询 功能 


用 户 在 购物 时 还 需要 知道 自己 在 近 一 段 时 间 一 共 购 买 了 多 少 商品 ， 单 击 导 航 条 中 的 “ 订 
单 租 询 ” 人 命令， 打开 答 询 输入 的 页 面 order search.asp， 在 得 询 文 本 域 中 输入 客户 的 订单 编 
写 ， i 于 your_order.asp 页 面 得 到 订 定 的 处 理 情况 ， 方 便 与 网 站 管理 者 沟通 


:订单 查询 输入 


订单 合 询 功能 和 首页 中 的 商品 搜索 功能 设计 方法 是 一 样 的 ， 和 需要 在 输入 的 俘 询 负面 中 设 
置 好 数据 库 连 接 ， 设 置 得 询 输 入 文本 域 ， 建 立 SQL 查询 命令， 具体 的 设计 分 析 同 前 面 的 搜 
索 功 能 模块 设计 ， 完 成 后 的 效果 如 图 9-33 所 示 。 
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图 9-33 订单 查询 页 面 


9.6.2 蛙 查 询 结果 


your orderasp 负面 是 用 户 输 入 订单 查询 后 ， 单 击 “ 查 询 ” 按 钮 弹出 的 查询 结果 页 面 。 设 
计 分 析 同 search_result.asp， 这 里 不 再 介绍 ， 完 成 后 的 效果 如 图 9-34 所 示 。 
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图 9-34 用 户 订单 查询 结果 


购物 车 后 合 警 理 


购物 车 后 从 系统 是 整个 网 站 建设 的 难点 ， 它 几乎 包括 了 所 有 的 常用 ASP 处 理 技术 ， 包 


了 zd 
Sr a 
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括 了 新 闻 系 统 的 管理 功能 、 订 单 的 处 理 功 能 和 商品 的 管理 功能 。 新 闻 系 统 的 管理 在 前 面 草 节 
中 已 经 介绍 过 ， 这 里 不 再 介绍 ， 在 此 重点 介绍 订单 处 理 功 能 和 商品 的 管理 功能 。 


= 局 全 册 后 全 登录 


网 站 拥有 者 需要 登录 后 台 管 理 网 上 购物 系统 ， 由 于 涉及 到 很 多 丙 业 机 蜜 ， 所 以 需要 议 计 
登录 用 户 确 认 页 面 ， 通 过 输入 唯一 的 用 户 名 和 密码 才 可 以 登录 后 台 进 行 管 理 。 本 网 上 购物 系 
统 为 了 方便 使 用 ， 只 和 需要 在 目 负 用 户 系 统 中 直接 输入 “用 户 名 ”admin 和 “密码 ”admin， 丈 
可 以 登录 后 台 。 因 此 需要 制作 用 于 判断 后 台 登 录 管理 里 份 确认 的 动态 文件 check admin.asp。 

该 页 面 制 作 也 比较 人 简单， 完成 后 的 代码 如 下 : 


<% 
1f session("user prop")<>"admin" then 
response.Redirect("/member/login.asp?error in 传 请 用 管理 员 账 号 登录 进入 后 台 管 理 ! 由 
end if 
900>> 


// 判 断 有 用户 是 否 为 admin， 如 果 不 古 就 打开 出 错 信息 页 面 


s 记 2 订单 管理 


order admin 文件 夹 用 于 放置 后 台 订 单 处 理 的 一 些 动 态 页 面 。 里 面 分 别 放置 了 如 下 5 个 
动态 页 面 : 

del orderasp: 删除 订单 。 

mark orderasp: 标记 已 处 理 订单 。 

order list.asp: 后 台 客 户 订 单列 表 。 

order list mark0.asp: 未 处 理 客 户 订 单列 表 。 

order list markl.asp: 已 处 理 客 户 订 单列 表 。 

下 面 分 别 分 析 各 页 面 的 ASP 命令 : 

用 于 删除 订单 的 动态 页 面 del orderasp， 如 图 9-35 所 示 。 


ED: \chap03\admintorder_admin\del_order. asp (KHTML) - x 
CL config.asp check admin.asp YT 
《1!--#include file="../../config.asp"--> 
Bb EN < |——#include file="../check_admin. asp” ——> 


4 if request ("del_orderID")<>"" then 
5 Set rs_order_product = cam.execute("delete * from 订单 产品 WHERE 订单 ID=”&request ("del_orderID")&"*") 
Set rs_order = corm. execute("delete * from 订单 表 WHERE 订单 ID=”"&request (“del_orderID")& "の") 
1f Err.Number> then 
response.Wwrite“ 对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 ...” 
response. end 
else 
cornn. close 
set corm=nothing 
response. redirect “order_list.asp” 
end 1f 
selse 
6 conn. close 
| 气 | set Corn=rnothing 
天 二 8 response. Redirect (request. serverVariables ("Http_REFERER" ) ) 
ESE end 1f 
六 > 
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图 9-35 删除 订单 页 面 del order.asp 


购物 系统 


ASP 命令 说 明 如 下 : 


<!--#include file="../../config.asp"--> 
/通过 config.asp 页 面 建 立 数据 库 连 接 
<!--#include file="../check admin.asD "-- テ > 
<% 
if request("del orderID")<>"" then 
Set rs order product = conn.execute("delete * from 订单 商品 WHERE 订单 ID="&request ("del 
orderID")&"") 

// 通过 delete 命令 删除 订单 
Setrs order = conn.execute("delete * from 订单 表 WHERE 订单 ID="&request("del orderID")&"") 

if Err.Number>0 then 

response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 … 
response.end 

/删除 失败 显示 的 信息 

else 


conn.close 
set conn=nothing 
response.redirect "order Iist.asp" 
end 1f 
else 
conn.close 
set conn=nothing 
response.Redirect(request.serverVariables( "Http REFERER")) 
end if 
0%0> 


mark orderasp 标记 已 处 理 订单 ， 如 图 9-36 所 示 。 


| nr い chap09Vadmintordsy_admintmayk_order.asp (XHTML) = El 


config.asp check admin. asp 
《1--#include file="../../confige. asp ——> 
《1--#include file="../check_admin. asp” ——> 
< 六 
if request ("mark_orderID")<>"" then 
set rs=server. createobject ("adodb. recordset") 
sql="update 订单 表 set 是 否 处理 =”"&request ("mark")&””where 订单 ID=”"&request ("mark_arderTD")& 
rs. open sqgl, Corm。 1, 1 
1f Err.Jumber>0 then 
response. write“ 对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 懂 再 试 ..." 
response. end 
else 
response. redirect (request. serverVariables ("Http_REFERER" ) ) 
end if 
end 1f 
rs. close 
set rs=nothing 
corm. close 
set corrn=rnothing 
六 > 
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图 9-36 标记 已 处 理 订单 页 面 


程序 说 明 如 下 : 


<!--#include file="../../config.asp"--> 


/通过 config.asp 页 面 建立 数据 库 连 接 


< プ 


人 DD es 
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<!--#include file="../check admin.asp"--> 
<% 
if request("mark orderID")<>"" then 

set rs=server.createobject("adodb.recordset") 

sql="update 订单 表 set 是 否 处 理 ="&request("mark")&" where 订单 ID="&request("mark 
orderID")&"" 

rs.open Sql,conn,1 ,1 
/如 果 请 求 变量 mark orderID 不 为 宇 ， 则 标记 为 已 处 理 订 单 

if Err.Number>0 then 
response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 …" 


response.end 


else 
response.redirect(request.serverVariables("Http REFERER")) 
end 1f 
end 1f 
rs.close 
set rs=nothing 
conn.close 
set conn=nothing 
0%0> 


order_listasp 后 台 客 户 订单 列表 的 设计 页 面 如 图 9-37 所 示 。 该 页 面 中 有 “ 订 
单 查询 ”功能 ， 还 有 订单 的 详细 结果 ， 这 些 技术 在 前 面 的 页 面 制作 中 已 经 介绍 
方 在 于 “订单 号 : ”这 一 栏 ， 里 面 有 删除 订单 功能 。 


中 | itchap03tadmintiorder_admirorder 1ist.asp こ 回 


config. asp check admin. asp main menu. asp index. css 


a es 
按 订 单 号 查询 : 昔 
トト すす すす ササ サ すす ササ すす すす すす すす すす す YYYYTYYrE エ デム ~ 
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9-37 客户 订单 列表 


并 :让 庆 汉 购物 系统 


下 面 对 访 行 的 代码 进行 分 析 说 明 : 
<tr> 
<td width="30%" bgcolor="#FFFFFF"><strong> 订 蛙 写 : <%=rs order(" 订 早 ID")%> 
// 显 示人 处 理 的 订单 编写 © 
</strong></td> 
<td width="24%" bgcolor="#FFFFFF"> 日 期 : <%=rs_order(" 订 单 日 期 )%></td> 
<td width="16%" bgcolor="#FFFFFF"> <% 
ifrs order(" 是 合 处 理 )=1l then 
%> <font color="#FF6600"> 己 处 理 </font> 
<% 
else 
%> <font color="#0033FF"> 未 处 理 </font> <%end if2%> </td> 
// 如 果 僵 得 " 是 否 处 理 " 的 值 为 1 那么 显示 为 已 处 理 ， 人 否则 显示 为 未 处 理 
<td width="30%" bgcolor="#FFFFFF"><table width="100%" border="0" cellspacing="3" cellpadding="0"> 
<tr> 
<td width="65%" align="center" valign="middle" bgcolor="#C4DCB6" onMouseOver="mOvr 
(this,#79B43D');" on MouseOut="mOut(this,'#C4DCBO6');" > 


<% 
ifrs order(" 古 人 奋 人 处 理 ")=1 then 
0%0> 
<a href="mark order.asp?mark orderID=<%=rs order(" 订 单 ID)%>&mark=0"> 标 记 为 未 处 理 </a> 
<% 
else 
0%0> 
<a href="mark order.asp?mark orderID=<%=rs order(" 订 单 D")%>&mark=1' 人 > 标记 为 已 处 理 <Ja> 
<%end lfyo> 
// 标 记 是 否 处 理 的 订单 ， 并 通过 订单 ID 号 设置 连接 页 面 
</td> 


<td width="35%" align="center" valign="middle" bgcolor="#C4DCB6" onMouseOver="mOvr 
(this,#79B43D');" on MouseOut="mOut(this,'#C4DCBO6');" > 
<a href="del order.asp?del orderID=<%=rs order(" 和 本 単 ID の >" onClick="return confirm( 真 的 要 删 
除 这 份 订单 吗 ? "> 删除 
/通过 订单 ID 删除 选择 的 订单 
</a></td> 
</tr> 
</table></td> 


</tr> 


order list mark0.asp 未 处 理 客户 订单 列表 用 于 显示 所 有 没有 处 理 的 客户 订单 页 
面 ， 完 成 后 的 设计 效果 如 图 9-38 所 示 。 该 页面 的 制作 同 order_listasp， 除 减少 了 搜索 功能 ， 
该 页 面 中 显示 的 是 rs_order(" 是 否 人 处理 "=1 的 所 有 未 处 理 订 单 。 有 具体 的 代 但 读者 可 奉 看 光盘 
中 的 源 代码 。 
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图 9-39 ”未 处 理 客 户 订 单列 表 


可 以 看 出 
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备 户 订单 列表 和 未 处 理 客户 订 早 列 表 是 相对 的 功能 
盏 处 理 ") 的 值 不 等 于 1 时 订单 都 会 显示 在 该 页 面 ， 完 成 后 的 效 末 如 图 
9-39 所 示 。 具 体 的 代码 读者 可 奉 看 光盘 中 的 


设计 的 思路 主要 是 对 编辑 过 的 订单 赋值 
为 已 处 理 订单 和 未 处 理 订单 


product admin 文件 夹 用 于 放置 商品 管理 的 页 面 ， 主 要 包括 了 如 下 9 个 页 面 ， 这 是 购物 S 
系统 的 重点 和 难点 ， 涉 及 到 上 传 图 乒 等 高 难度 编程 操作 。 


del product.asp: 删除 商品 页 面 。 

insert product.asp: 插入 商品 页 面 。 

product add.asp: 添加 商品 信息 页 面 。 

product list.asp: 后 合 管理 商品 列表 。 

product modifyasp: 更 新 商品 信息 页 面 。 

update product.asp: 建立 上 传 命 令 动态 页 面 。 

upfile.asp: 上 传 文件 测试 动态 页面 。 

upfile.htm: 上 传 图 厂 文 件 议 态 测 试 页 面 。 

upload 5xsoft.inc: 上 传 文件 ASP 命令 模版 。 

搁 术 难度 主要 在 于 图 片 的 上 传 功能 ， 这 9 个 页 面 当中 上 传 文件 测试 动态 页 面 upfile.asp 
和 上 传 图 卢 文 件 毅 态 测试 页 面 upfile.htm 和 本 系统 不 相关 的 页 面 ， 单 独 列 出 是 为 了 说 明 如 何 


上 传 图 片 。 


删除 商品 页 面 del_product.asp 只 是 一 段 删 除 商品 的 动态 页 面 ， 代 码 在 前 面 的 删 
除 功 能 中 经 党 使 用 到 ， 如 图 9-40 所 示 。 


全 D:Acehap09Aadminprodact _adnminvdel_product.asp (XHTML) 


= 回 


[ 源 式 到 】 config.asp check admin. asp 


注 叶 入 | 诡 口 


る 
2 


回 
トイ 4 
ロ 
ww 


K!--#include file="../../config. asp 一 -> 
“1--#include file="../check_admin. asp "一 -> 
< 
if request("de] productID")<>"" then 

corm.execute("delete * from 产品 表 WHERE 产品 ID="&CInt (request ("del_productID"))) 

corm.execute("delete * from 订单 产品 WHERE 产品 ID="“"&request ("del_productID")&"*") 

if Err. Number?D then 
response. Write“ 对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 姓 再 试 ...” 
response. end 
else 
cormn. close 
set corr=rnothing 
response. redirect “product_list. asp” 

end if 
else 

corm. close 

set corm=nothing 

response. Redirect (request. serverVariables ("Http_REFERER" ) ) 
end if 
闹 > 


2KY1 秒 简体 中 文人 82312) 


9-40 del product.asp 删除 商品 页 面 


具体 的 代码 如 下 : 


く !-- ガ Imclude file="../../config.asp"--> 
<!--#include file="../check admin.asp"--> 


<% 


if request("del productID")<>"" then 


Dreamvweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


conn.execute("delete * from 商品 表 WHERE 商品 ID="&CInt(request("del productID"))) 
conn.execute("delete * from 订单 商品 WHERE 商品 ID="&request("del productID")&"") 


if Err.Number>0 then 
response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 …" 
response.end 
else 
conn.close 


set conn=nothing 
response.redirect "product list.asp" 

end 1f 
else 

conn.close 

set conn=nothing 

response.Redirect(request.serverVariables("Http REFERER")) 
end 1f 
0%0> 


插入 商品 页 面 insert product.asp， 是 一 段 插 入 记录 的 代码。 当中 引用 了 
upload Sxsoft.mc 的 程序 代码， 如 图 9-41 所 示 。 


ni い chap09Madmintprodnct_admintinsert_product.asp (XHTML) = 


《1--#imnclude file="../../ config. aSD ーー> 
《1--#include file="../check_admin. asp "一 -> 
《1--#include file="../.. /main_ menu. asD 一 一 > 
“1--#include FILE="upload 5xsoft. inc”——> 
<% OPTION EXPLTCTTW%> 

く %Seryer。 Script TimeOut=5000%> 

<% 

dim upload, file, formlame, formPath, imageName 
imageName="" 

set upload=new upload 5xsoft 


@A config.asp check admin.asp main menu.asp upload 5xsoft.inc 〒 
へ 


ロロ 


し いい 電 時 板 ーー 


“建立 上 传 对 全 ーー 


~ 
” 本 


if upload.form("f ュ 1enath")=““ then ”得 天 上 传 目 孙 
set upload=nothing 

response. end 

else 

formPath=upload. form (“filepath") 

“三 目录 后 加 i 

if right (formPath, 1)<>"/" then formPath=formPaths"/" 
end 1f 


に つ 


iE 


for each formName in upload.objFile ”“ 列 出 所 有 上 伟 
set file=upload. file (formName) ”生成 一 个 芯 忻 对 备 
if file.FileSize>0 then 如 果 FileSize >0 说 明 有 文件 数据 

file. Saveas Server.mnappath(formPathé&file. FileNlame}) 


response. write file.FilePFathifile.FileNamet ZE 』 &formPath&File. FileNames 


tc 
|¢ 
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图 9-41 insert product.asp 插入 商品 页 面 


有 具体 的 代码 如 下 : 


<!--#include file="../../config.asp"--> 
<!--#include file="../check admin.asp"--> 
<!--#include file="../../main menu.asp"--> 
<!--#include FILE="upload Sxsoft.inc"--> 
<%'OPTION EXPLICIT%> 
<%Server.ScriptTimeOut=5000%> 

<% 


dim upload,file,formName,formPath,imageName 


EE 半 : 殿 瑞 记 购物 系统 


imageName="" 
set upload=new upload Sxsoft "建立 上 传 对 象 
if upload.form("filepath")="" then "得 到 上 传 目 录 
set upload=nothing 
response.end 
else 
formPath=upload.form("filepath") 
"在 目录 后 加 (/) 
if right(formPath,1)< テ リル then formPath=formPath&"/" 
end if 
for each formName in upload.objFile " 列 出 所 有 上 传 了 的 文件 
set file=upload.file(formName) “生成 一 个 文件 对 象 
if file.FileSize>0 then "如 果 FileSize >0 说 明 有 文件 数据 
file.SaveAs Server.mappath(formPath&file.FileName) "保存 文件 
'response. write file.FilePath&file.FileName&" ("&file.FileSize&") => "&formPath&File.FileName&" 
成功 !<br>" 
ImageName=File.FileName 
end if 
set file=nothing 
next 
"删除 此 对 象 
'sub HtmEnd(Msg) 
' set upload=nothing 
'response. write "<br>"&Msg&" [<a href=""javascript:history.back();""> 返 回 </a>]</body></html>" 
'response.end 
'end sub 
'for each formName in upload.objForm " 列 出 所 有 form 数据 
' response.write "pro_chandi="&upload.form("pro_chand")&"<br>" 
mext 
00>> 
<% 
if upload.form("pro mingcheng")<>"" then 
pro mmngcheng デ upload.form( "pro_mngcheng") 
pro_genmu デ upload.form( "pro_genmu'") 
pro zimu=upload.form("pro zimu") 
pro_bianma=CStr(upload.form("pro bianma")) 
pro_tiaoxingma=upload.form("pro_tiaoxingma") 
pro Jiage=upload.form("pro jiage") 
pro_chandi=upload.form("pro_chandi") 
pro_danwei=upload.form("pro_danwei") 
pro_guige=upload.form("pro_guige") 
pro zaljia=upload.form("pro_ zaljia") 
pro _tuijian=upload.form("pro_tuijian") 
pro_shuoming=upload.form("pro_shuoming") 
conn.execute("insert into 产品 表 ( 商 品名 称 ,商品 编码 ,条 人 码 ,零售 价 ,产地 ,单位 ,规格 ,产品 
图 片 , 子 类 别 DD, 根 美 別 ID, 在 架 状 态 ,主页 推荐 ,商品 说 明 ) values ("&pro mingcheng&", 
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"pro_blanmaw", "pro tiaoxingma&","&pro_ Jlage&",""&pro chandi&","&pro danwelk "pro _ 
guige&","&imageName&","&pro zimu&","&pro genmu&","&pro zaljia&","&pro tuijian&","&p 
ro_shuoming&"")") 
end if 
if Err.Number>0 then 
response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 …" 
response.end 
else 
conn.close 
set conn=nothing 
set upload=nothing 
response.Redirect( "product add.asp?return ip 个 添加 产品 信息 成 功 ， 请 继续 添加 ! " 
end 1f 
906> 


添加 商品 信息 页 面 product add.asp 和 用 户 注 册 系 统 的 用 户 信 息 输 入 页 面 卉 不 
多 ， 只 是 多 了 商品 图 片上 传 功能 ， 页 面 中 的 内 容 为 表单 中 建立 相应 的 动态 对 象 。 设 计 的 效果 
如 图 9-42 所 示 。 


中 | D: chap03%adminiproduct_adminiproduct_add. asp = Ia 


config. asp check admin. asp main menu. asp index. css 
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9-42 ”设计 的 添加 商品 信息 页 面 


product list.asp 后 台 管 理 商品 列表 建立 。 该 页 面 完 成 后 的 效果 如 图 9-43 所 示 。 
页 面 中 列 出 了 商品 的 一 些 信息 比如 是 否 有 图 片 ， 商 品 价格 等 信息 ， 主 要 是 后 面 的 “修改 ”及 
“删除 ”功能 ， 通 过 单 击 “ 人 修改” 命令 可 打开 更 狐 商品 信息 页 面 product modifyasp 进行 商品 
更新 。 
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图 9-43 疫 填 完成 的 后 台 管理 商品 列表 


5) 更 新 商品 信息 页 面 product modifyasp 的 设计 同 新 闻 系 统 中 的 更 新 新 闻 功 能 类 
似 。 设 计 方法 略 ， 读 者 可 以 打开 光盘 中 的 源 代码 进行 学 习 参 考 。 完 成 后 的 设计 效果 如 图 9-44 
所 示 。 
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图 9-44 更 新 商品 信息 


Me)】 单 击 更 新 商品 信息 页 rode nod a 中 的 “提交 ”按钮 ， 可 通过 
update product.asp 建立 上 传 命令 动态 页 面 实现 。 访 动态 页 面 的 功能 命令 和 insert product.asp 
插入 商品 页 面 关 似 ， 难 点 在 于 图 片 的 上 传 更 新 。 访 者 可 打开 源码 进行 学 习 。 
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关于 upfile.asp 上 传 文件 测试 动态 页 面 、upfile.htm 上 传 图 片 文件 静态 测试 页 
面 、upload_5Sxsoftinc 上 传 文件 ASP 命令 模版 3 个 页 面 是 为 了 方便 建立 购物 车 时 单独 调用 ， 
里 面 也 有 详细 的 程序 解释 说 明 ， 在 本 系统 中 不 再 介绍 。 


_Section | 


放下 辅助 页 面 


通过 上 面 几 个 小 节 的 分 析 与 设计 ， 该 网 站 的 在 线 购物 功能 及 后 台 管理 功能 基本 上 已 经 开 
发 完成 ， 但 还 有 很 多 的 说 明 页 面 ， 如 制作 与 购物 相关 的 一 些 说 明 clientasp， 用 来 说 明 售后 服 
务 的 页 面 service.asp， 关 于 企业 的 内 容 从 介 页 面 about us.asp 等 是 需要 由 网 站 拥有 者 根据 实 
际 情况 设计 的 。 网 上 购物 系统 还 要 根据 开发 的 系统 设计 一 个 购物 流程 ， 在 首页 或 者 是 其 他 功 
能 页 面 说 明 购 物 、 结 算 、 售 后 服务 等 详细 的 过 程 ， 这 也 要 根据 实际 的 物流 配送 情况 来 设计 。 

到 这 里 一 个 功能 完善 的 购物 系统 就 开发 完毕 了 ， 通 过 设计 这 个 系统 读者 可 以 掌握 如 何 利 
用 ASP 实现 一 个 购物 车 的 基本 思路 。 
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了 搜索 引擎 营销 所 带 来 的 好 处 ， 但 其 晶 贵 的 
费用 及 带 来 的 一 些 负面 影响 却 让 很 多 企业 望 | 入 
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方面 的 知识 ， 包 括 SEO 基 础 知识 、 搜 索引 人 擎 

基础 、 如 何 设 计 正 确 的 企业 网 站 SEO 方案 ， 

以 及 选择 企业 关键 词 的 重要 性 等 ， 以 帮助 读 

者 掌握 搜索 引擎 网 站 优化 的 技术 。 
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ン Dreannweaver CS 


SEO 搜索 引擎 优化 基础 


搜索 引 敬 优化 SEO) 是 一 种 新 兴 的 技术 ， 很 多 人 对 此 疝 不 了 解 。 本 节 将 问讯 者 介绍 
SEO 的 基础 知识 。 


”SEO 基 本 概念 


SEO 的 天 文 全称 为 Search Engine Optimization， 意 思 就 是 搜索 引擎 优化 ， 是 指 通 过 采用 
合理 技术 手段 ， 使 网 站 各 项 基本 要 素 更 适合 搜索 引 获 的 检索 原则 并 且 对 用 户 更 友好 ， 从 而 更 
容易 被 搜索 引擎 收录 及 优先 排序 。 简 单 地 说 ，SEO 就 是 指 通过 总 结 搜 索引 警 的 排名 规律 ， 对 
网 站 进行 合理 优化 ， 使 网 站 在 搜索 引擎 中 的 排名 提高 ， 以 融 来 更 多 的 客户。 


SEO 的 优 缺 点 
SEO 能 在 竞价 排名 的 竞争 中 更 胜 一 筹 ， 受 到 广大 用 户 的 追捧 ， 必 定 有 其 内 在 的 原因 ， 作 为 
主要 的 搜索 引擎 营销 方式 之 一 ，SEO 具备 以 下 特点 。 


SEO 的 优点 : 

(1) 成 本 较 低 : SEO 是 一 种 “免费 ”的 搜索 引擎 香 销 方式 ， 对 于 个 人 网 站 而 言 上 只 要 掌握 
一 定 的 搜索 引 敬 优化 技术 就 可 以 达到 目的 ， 对 于 企业 网 站 而 言 束 要 通过 聘用 专业 的 技术 人 员 
实施 ， 或 者 让 专业 公司 进行 代劳 了 ， 而 即使 如 此 ， 网 站 通过 SEO 维持 一 年 排名 的 费用 ， 通 
第 也 仪 仪 是 做 苋 价 一 到 两 个 月 的 费用 ， 相 比 东 价 要 便宜 很 多 。 


强 ， 所 在 位 置 也 许 数 年 时 间 都 不 会 变动 。 

(3) 不 用 担心 无 效 点 击 : 通过 SEO 技术 优化 的 网 站 排名 效果 比较 稳定 ， 是 自然 排名 ， 
不 会 授 点 击 付费 ， 不 论 您 的 竞争 对 手 如 何 点 ， 都 不 会 给 您 浪费 一 分 钱 。 

(4) 所 有 搜索 引擎 通用 : SEO 技术 最 大 的 好 处 束 是 具有 通用 性 ， 即 使 只 针对 百度 进行 优 
化 ， 但 其 他 的 搜索 引擎 上 的 排名 都 会 相应 的 提高 ， 会 给 您 带 来 更 多 的 有 效 访 问 者 。 

SEO 的 鉄 点 : 

(1) 见效 比较 慢 : 通过 SEO 方式 获得 排名 是 无 法 速成 的 ， 一 般 难 度 的 关键 词 大 约 需 要 
2 一 3 个 月 的 时 间 ， 如 果 难 度 较 大 的 词 则 需要 4 一 $ 个 月 甚至 更 久 ， 建 议 企 业 可 以 在 销售 淡季 
进行 网 站 优化 工作 ， 到 了 销售 旺季 时 排名 也 基本 稳定 了 。 

(2) 排名 的 不 确定 性 : 由 于 搜索 引擎 对 排名 有 各 目的 不 同 规则 ， 有 可 能 在 某 天 某 个 搜索 
引擎 对 排名 规则 进行 了 改变 ， 那 时 也 许 就 会 出 现 原 有 的 排名 位 置 发 生变 动 ， 这 个 是 很 正常 的 
现象 。 

(3) 关键 词 区 分 难 易 程度 : 苋 争 过 于 激烈 的 关键 词 ， 例 如 ; 手 机 、MP3 等 , 用 SEO 方 
式 做 优化 排名 难度 是 很 大 的 ， 这 需要 非常 久 的 时 间 ， 而 且 价 格 也 会 非常 高 昂 ， 所 以 难度 太 大 
的 词 不 适合 做 优化 。 
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Em 性 功 題 SEO 搜索 引擎 优化 技术 


价 


(4) 百度 排名 位 置 在 竞价 排名 之 后 : 在 百度 搜索 引擎 里 自然 排名 所 在 的 位 置 只 能 在 竞 
目前 


排名 的 网 站 之 后 ， 如 末 第 一 页 全 部 做 满 了 苋 价 排名 ， 那 卓然 排名 只 能 出 现在 第 二 页 ， 但 
此 种 情况 仅 百 度 存 在 。 

(5) 关键 词 数量 有 限 : 用 SEO 方式 做 网 站 优化 ， 一 个 网 页 推荐 只 做 一 个 关键 词 ， 如 果 
多 的 话 最 好 也 不 超过 3 一 4 个 ， 其 中 1 一 2 个 古 主 词 ， 剩 余 1 一 2 个 是 分 词 ， 无 法 做 到 苋 价 排 
名 那 种 想 做 多 少 做 多 少 的 效 来 。 


”SEO 包 含 工作 


SEO 包含 的 优化 技术 主要 可 分 为 整 站 搜索 引擎 优化 〈 简 称 整 站 优化 ) 与 关键 字 网 页 排名 
优化 (简称 网 页 优化 )。 

1. 网 页 优化 

网 页 优化 是 指 通 过 SEO 技术 对 网 站 内 与 关键 字 相关 的 网 页 进行 优化 、 使 其 单个 网 页 搜 
索引 擎 排名 更 加 靠 前 。 网 页 优化 可 以 根据 指定 的 关键 字 在 各 大 搜索 引擎 上 使 指定 的 网 页 排名 
靠 前 ， 便 于 搜索 者 能 够 轻松 地 找到 此 网 页 信息 ， 目 前 国内 的 搜索 引擎 优化 服务 商 提供 的 基本 
都 是 网 页 优化 服务 ， 根 据 推广 的 关键 字 提 升 网 页 排名 。 

搜索 引擎 优化 (网 页 优化 ) 技术 主要 分 为 两 部 分 : 

(1) 网 页 的 内 部 优化 ， 相 对 单个 网 页 而 言 、 主 要 是 修改 网 页 内 部 的 代码 标签 、 关 键 字 密 
度 、 从 而 增加 其 搜索 引擎 的 友好 性 。 

②) 网 页 的 外 围 优化 ， 对 于 网 页 的 URL 路 径 实行 增加 外 部 链接 〈 别 的 站 点 指向 此 页 面 
的 链接 )、 链 接 文字 为 指定 相关 关键 字 或 者 链接 为 其 他 方式 ， 外 围 优化 可 与 网 页 内 部 优化 相 
协调 使 用 ， 此 项 工作 必须 贯彻 全 过 程 。 

2， 整 站 优化 

整 站 优化 是 指 通过 SEO 技术 使 其 网 站 在 搜索 引擎 中 成 为 一 个 权威 站 点 。 当 整 站 优化 达 
到 预期 效果 时 ， 该 网 站 的 任意 一 个 分 页 面 都 可 以 在 搜索 引擎 中 争夺 热门 关键 字 ， 而 全 站 的 关 
键 字 不 计 其 数 ， 根 据 收录 页 面 数量 来 决定 。 假 设 这 是 一 个 
行业 性 质 站 点 ， 在 做 完整 站 优化 后 很 有 可 能 利用 这 一 个 网 sei 
站 包含 这 个 行业 的 所 有 匹配 关键 字 (其 中 包含 长 尾 关键 字 
等 等 )。 整 站 优化 虽 不 能 保证 某 个 关键 字 的 排名 提升 ， 但 
好 的 整 站 优化 能 够 保证 搜索 引擎 营销 的 整体 效果 。 PPP 

搜索 引擎 优化 〈 整 站 优化 ) 技术 主要 分 为 ; 

(1) 站 内 结构 优化 ， 除 包括 上 述 网 页 内 部 优化 ， 还 包 
括 网 站 程序 修改 、 网 站 内 部 整体 链接 优化 、 用 户 体验 度 优 
化 、 网 站 目录 结构 层次 规划 优化 、 网 站 地 图 制作 。 效果 分 析 

(2) 搜索 评级 优化 ， 对 于 网 站 首选 域名 增加 大 量 的 、 
高 质量 的 、 针 对 性 强 的 外 部 链接 ， 而 站 首页 不 争夺 任何 关 
键 字 ， 仅 仅 保 存 网 站 品牌 名 称 。 

网 站 优化 的 主要 工作 流程 如 图 10-1 所 示 : 


网 站 内 部 结构 调整 


DPC 
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Section 


核 心 关键 字 字 筑 四 


要 对 网 站 进行 优化 ， 首 先 要 确认 一 下 推广 网 站 页 面 押 选择 的 关键 池 ， 然 后 围绕 关键 字 开 
一 系列 的 优化 工作 ， 以 提高 负面 在 相关 关键 子 搜索 结 来 中 的 排名 。 本 小 市 重点 介绍 关于 关 
nt 些 知 识 。 


1021 


根据 潜在 客户 或 目标 用 户 在 搜索 引擎 中 找到 你 的 网 站 时 输入 的 语句 ， 产 生 了 天 键 子 
(Keywords) 的 概念 ， 这 不 仅 是 搜索 引擎 优化 的 核心 ， 也 是 整个 搜索 引擎 理 销 都 必须 围 经 的 核 
心 。 首 先 要 确定 推广 的 核心 天 键 字 ， 再 围 经 核心 关键 字 进行 排列 组 合 产生 关键 词组 或 短 人 句 。 

合 看 关键 字 的 方法 : 在 浏览 器 中 打开 目标 网 页 ， 点 击 来 单 栏 上 的 “ 答 看 ”一 “ 源 文 
件 ” 一 “<meta name="keywords" conten 全 ”后面 的 文字 即 该 网 站 关键 字 ， 10-2 所 示 的 是 
一 家 婚纱 企业 网 站 的 关键 学 。 


四 sww.jadebrida1[1] - 记事 本 周回 
文件 W) 编辑 不 ) 格式 (0) 查看 WW) 和 帮助 00) 

<*DOCTYPE html PUBLIC "-//W3C//DTD XHTHL 1.8 Transitional//EN" 

"http: 7/4uuy.u3 -0F ロ /TR/xhtm117DTD/xhtm11-trans1tiona1 .dtd"> 

く htm1 xmlns="http: 474wuy.u3 0FH/1999/ghtm1"> 

く head> 

く meta http- equiv= "Content-Tuype'" content="text#html; charset=utf-8" ‘> 

<meta name= "keyword conte HR 


、 个 UL 
、bridal gowns、bridalwear、eveningwear Fide、 ]ade bridal、bridal、exclusiue、femail、 
beijing、 a london、paris、milan、wedding、wedding dress,china,dress,evening 
二 :gouns 
name="description" content= 人 i 婚纱 定做 、 、 北京 全 
J 婚纱 、 礼 服 ， re , He 旨 纱 、 高 级 定做 、 高 级 1 婚纱 礼 
Ci 起 の 中 国 婚 纱 、 中 国 婚 3 拉 め 设计 、 娘 纱 饥 计 半 、 婚 参 礼服 、 既 纱 礼服 
札 』 县 计 响 、 bridesmaids、 TH owns、 bridalwear、 eueningwear、 Bride、 jade 
pia 4 MT femail、 beijing、newyork、london、paris、milan、wedding、wedding 
dress,china,dress,evening dress,gowns"> 
<LINK href="cssi1css.css"" type=textjcss 
rel=stylesheet><LINK href="css/icss.css" type=text/css rel=stylesheet> 
<title>jadewen</title> 
く stu1e type="'text/css"> 
くき ーー 


图 10-2 查看 关键 学 的 方法 


和 2 者 克 择 天 键 子 


对 企业 、 商 家 而 言 ， 核 心 关键 学 就 是 他 们 的 经 营 范 围 ， 如 产品 、 服 务 名 称 、 行 业 定位 ， 
以 及 企业 名 称 或 品牌 名 称 和 等。 选择 关键 学 时 应 该 注意 如 下 一 些 常识 。 

(1) 从 客户 的 角度 考虑 : 潜在 客户 在 搜索 你 的 产品 时 将 使 用 什么 关键 字 ? 这 可 以 从 众多 
资源 中 获得 反馈 ， 例 如 从 你 的 客户 、 供 应 商 、 品 牌 经 理 和 销售 人 员 那 里 获知 其 想法 。 

(2) 将 关键 字 扩 展 成 一 系列 词组 和 短语 : 尽量 不 要 用 单一 词汇 ， 而 是 在 单一 词汇 基础 上 
进行 扩展 ， 如 : 服 帮 一 流行 服 猴 一 时 尚 流行 服 猴 。 百 上 度 关 键 字 工 具 可 以 查询 特定 关键 字 的 第 
见 答 询 、 扩 展 匹配 及 奏 询 热度 ， 最 好 的 关键 字 是 那些 没有 被 广泛 使 用 而 又 很 多 人 搜索 的 字 。 

(3) 进行 多 重 排列 组 合 : 例如 ， 改 变 短 语 中 的 字 序 以 创建 不 同 的 词语 组 合 ;使 用 不 党 用 


泛 下 二天 和 SEO 搜索 引擎 优化 技术 


的 组 合 ; 组 合成 一 个 问 句 ， 包 含 同 义 词 、 蕉 换 词 、 比 喻 词 和 常见 错 拼 词 的 组 合 ， 包含 所 卖 产 
品 的 商标 名 和 品名 的 组 合 ; 使 用 其 他 限定 词 来 创建 更 多 的 两 子 组 合 ， 三 学、 四 和子 组 合 。 

(4) 不 要 用 意义 太 泛 的 关键 学 : 如 朱 从 事 服 闭 设 备 制 造 ， 则 选择 “设备 ”作为 你 的 核心 
天 键 字 融 无 益 于 吸引 到 目标 客户 。 实 际 上 ， 为 了 准确 找到 需要 的 信息 ， 搜 索 用 户 倾 回 使 用 具 > 
体 词 汇 及 组 合 寻 找 信 息 〈 尤 其 是 两 词组 合 )， 而 不 是 使 用 那些 大 而 沁 的 概念 。 此 外 ， 使 用 意 
义 太 三 的 关键 池 ， 也 意味 看 你 的 网 站 要 跟 更 多 的 网 站 竞争 排名 ， 上 胜出 的 难度 更 大 。 

(5) 用 目 己 的 品牌 做 关键 衬 : 如 有 果 是 知名 企业 ， 则 别 款 了 在 关键 字 中 使 用 公司 名 或 产品 
品牌 名 称 。 但 如 果 不 是 知名 的 品牌 ， 则 宜 以 企业 要 销售 的 产品 对 象 名 称 作为 关键 字 。 如 使 用 
“流行 服 半 ”了 束 要 远 远 比 东 品牌 的 服 靖 强 的 多 ， 因 为 没有 人 知道 东 铝 牌 是 做 什么 的 ， 更 不 会 
去 搜索 这 个 关键 字 。 

(6) 适当 使 用 地 理 位 置 : 地 理 位 置 对 于 经 营地 方 性 业务 的 企业 尤其 重要 。 如 有 果 业 务 范围 
以 本 地 为 主 ， 则 在 关键 字 组 合 中 加 上 地 区 名 称 如 “北京 广告 创意 ”。 

(7) 参考 竞争 者 使 用 的 关键 字 : 碍 询 葛 争 者 的 关键 字 可 让 用 户 想 到 一 些 可 能 漏 拯 的 词 
组 。 但 不 要 照抄 任何 人 的 关键 子 ， 因 为 并 不 消 楚 他 们 为 何 要 使 用 这 些 关 键 子 一 一 你 得 目 己 想 
关键 字 。 参 考 别 人 的 关键 字 只 是 对 你 已 经 选 好 的 关键 字 进 行 补充 。 

(8) 不 用 无 关 的 关键 字 : 有 些 网 站 将 热门 的 词汇 列 入 目 己 的 关键 学 中， 尽管 这 个 热门 天 
键 字 跟 目 己 网 站 内 容 坚 不 相干 。 甚 全 有 人 把 竞争 对 手 的 品牌 也 加 入 到 目 己 的 关键 季 中 ， 这 是 
侵权 的 行为 。 由 于 这 些 所 请 “热门 ”词汇 并 未 在 网 站 内 容 中 出 现 ， 因 此 对 排名 并 无 实质 性 大 
助 ， 过 多 的 虚假 关键 字 还 可 能 受到 处 因 、 降 低 排 名 。 

(9) 适当 控制 关键 字数 量 ; 一 页 中 的 关键 字 最 多 不 要 超过 3 个 ， 而 所 有 内 容 都 应 针对 这 
几 个 核心 关键 字 展开 ， 这 样 才 能 你 证 关键 季 密 上 度 合 理 ， 搜 索引 擎 也 会 认为 该 页 主题 明确 。 如 
朱 确 实 有 大 量 关 键 字 需 要 呈现 ， 可 以 分 艇 写 在 其 他 页 面 并 进行 针对 性 优化 ， 这 也 十 为 什么 衣 
页 和 内 页 的 关键 字 往 往 要 有 上 所 区 别 的 原因 。 


“关键 字 密度 


在 确定 了 要 采用 的 关键 字 之 后 ， 需 要 在 网 页 文本 中 适当 出 现 这 些 关 键 字 。 关 键 字 在 网 页 
中 出 现 的 频次 ， 即 关键 字 密 度 (Keyword Density) ， 就 是 在 一 个 页 面 中 ， 占 所 有 该 页 面 中 总 
的 文字 的 比例 ， 访 指标 对 搜索 引擎 的 优化 效果 起 到 重要 的 作用 。 

关键 学 密度 的 算法 : 

关键 字 密 上 度 三 关键 学 词 频 /网 页 总 词汇 量 

公式 中 总 词汇 是 指 页 面 程序 标签 ( 如 HIML 标签 及 ASP、JSP、PHP 等 ) 以 外 的 所 有 词 
汇 的 数量 。 

中 文 关 键 字 密度 一 般 在 6% 一 8% 较为 合适 。 切 忌 进 行 关键 字 堆 砌 ， 即 一 页 中 关键 字 的 
出 现 不 是 根据 内 容 的 需要 安排 ， 而 是 为 了 讨好 搜索 引擎 人 为 堆积 天 键 了 学 。 这 已 经 被 搜索 引擎 
归 入 恶意 行为 ， 有 得 到 惩罚 的 风险 。 
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则 是 以 目 上 而 下 、 从 左 到 右 的 顺序 进行 。 下 面 我 们 就 介绍 一 下 关键 学 在 其 体 的 网 页 中 如 何 分 
布 是 最 有 效 的 。 

(1) 网 页 代码 中 的 Tite，META 标签 (关键 学 keywords 和 摘 述 description) 如 上 面 
举例 的 关键 字 分 布 : 

<meta name="keywords" content=" 姬 纱 专 卖 、 礼 服 专卖 、 婚 纱 礼服 专卖 、 晚 礼服 专 腾 、 
局 级 定制 、 礼 服 定 做 、 礼 服 定做 、 婚 纱 定做 、 婚 纱 定做 、 北 京 礼服 、 狐 女 礼 服 、 狐 女 婚 纱 、 
婚纱 、 礼 服 、 定 做 婚纱 礼服 、 定 做 婚纱 礼服 、 北 京 婚纱 、 高 级 定做 、 高 级 定做 婚纱 礼服 、 晚 
礼服 、 婚 纱 用 品 、 北 京 婚纱 礼服 、 中 国 婚纱 、 中 国 婚纱 网 、 婚 纱 设 计 、 婚 纱 设计 网 、 婚 纱 礼 
服 、 婚 纱 礼服 网 、 礼 服 设计 、 礼 服 设 计 网 、bridesmaids、bridal gowns 、 bridalwear 、 
eveningwear 、 Bride 、 jade bridal、 bridal、 exclusive 、 femail 、 be1jing 、newyork 、 london 、 


paris、milan、wedding、 wedding dress,china,dress,evening dress,gowns"> 

<meta name="description" content=" 礼 服 定做 、 礼 服 定做 、 婚 纱 定做 、 婚 纱 定做 、 北 京 礼 
服 、 新 女 礼 服 、 新 尹 婚纱、 婚纱、 礼服、 定做 婚纱 礼服 、 定 做 婚纱 礼服 、 北 各 婚纱 、 蜗 级 害 
做 、 蜗 级 定做 婚纱 礼服 、 瞳 礼服 、 婚 纱 用 品 、 北 各 婚纱 礼服 、 中 国 婚纱 、 中 国 婚纱 网 、 婚 纱 
设计 、 婚 纱 设 计 网 、 婚 纱 礼服 、 婚 纱 礼服 网 、 礼 服 设 计 、 礼 服 设计 网 、 bridesmaids、bridal 
gowns 、 bridalwear 、 eveningwear 、 Bride 、 jade bridal、 bridal、 exclusive 、 femail、 beijing、 


newyork、london、parlis、milan、 wedding、wedding dress,china,dress,evening dress,gowns"> 

(2) 网 页 正文 最 吸引 注意 力 的 地 方 : 正文 内 容 必 须 适 当 出 现 关 键 子 ， 并 且 “ 有 所 侧 
重 ”， 总 指 用 户 阅 读 习 惯 形成 的 阅读 优先 位 苟 按 从 上 到 下 、 从 左 至 右 成 为 天 键 词 重点 分 布 位 
四， 包括 : 页 面 徘 项 部 、 左 侧 、 标 题 、 正 文 前 200 和 社 以 内 。 在 这 些 地 方 出 现 关 键 字 对 排名 
更 有 帮助 。 

(3) 超 链接 文本 〈 锚 文本 ): 除了 在 导航 、 网 站 地 图 、 锚 文本 中 有 意识 使 用 关键 字 ， 还 
可 以 人 为 增加 超 链 接 文 本 。 如 一 个 章 痛 厂商 网 站 可 以 通过 加 上 以 下 行业 资源 : 中 国 章 装 阿 、 
流行 草 装 网 ……… 含有 “ 章 狼 ”文学 的 链接 来 达到 增加 超 链 接 文 本 的 日 的 。 这 也 值得 网 站 在 
添加 友情 链接 时 做 参考 ， 即 链接 对 象 中 最 好 包含 有 关键 学 或 相关 语义 的 网 站 。 

(4) Header 标签 : 即 正文 标题 <Hl><HIA> 中 的 文学 。 搜 索引 擎 比较 重视 标题 行 中 的 文 
字 。 用 <b></b> 加 粗 的 文学 往往 也 是 关键 学 出 现 的 地 方 。 

(5) 图 厂 Alt 属性 : 搜索 引擎 不 能 抓 取 图 厂 ， 因 此 网 页 制作 时 在 图 三 属性 Alt 中 加 入 关 
键 学 是 对 搜索 引擎 优化 的 好 办 法 ， 它 会 认为 该 图 请 内 容 与 你 的 关键 字 一 致 ， 从 而 有 利于 排名 。 

一 般 的 网 页 设计 都 由 网 页 设计 师 守成。 设计 师 设 计 网 站 往往 仅 从 美观 、 创 意 和 易 用 的 角 
度 考 虑 ， 这 对 于 一 个 期 望 在 搜索 引擎 中 排名 优 夯 的 两 业 网 站 来 说 ， 已 经 远 远 不 够 了 ， 网 站 策 
划 人 员 至 少 应 该 为 设计 师 制 定 一 份 需求 备 生 了 水 ， 提 醒 在 设计 中 需要 配合 和 注意 的 环节 。 


关键 字 评 估 


经 过 关键 字 的 寻找 及 用 户 搜 索 习 惯 分 析 后 ， 确 定 了 相应 的 关键 学 。 在 开始 使 用 关键 字 时 
还 要 对 其 进行 一 下 评 倍 ， 包 括 关 键 字 的 “搜索 量 ”“ 商 业 价 值 ””“ 苋 争 程序 ”， 再 从 中 入 选 
出 局 搜索 量 、 局 相关 性 、 低 竞争 的 关键 子 。 

1. 搜索 量 的 评估 

搜索 量 束 是 指 关键 学 在 某 个 搜索 引擎 网 站 上 的 搜索 量 ， 利 用 搜索 引擎 提 供 的 相关 工具 即 
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可 以 实现 评估 ， 在 光盘 中 source 文件 下 chap10 是 一 个 关键 字符 询 的 工具 。 
(1) 双击 运行 后 打开 其 主 界 面 如 网 10-3 所 示 。 


A adobe Flash Player 9 
立件 (ば ) 查看 0 控制 你 ) 帮助 


关键 字 排 名 查询 工具 你 有 多 少 个 站 ? 


查询 某 个 网 址 在 某 个 关键 字 搜索 结果 中 的 排名 
( 旭 使 用 帮助 入 Ver. 2011-02-22 


一 查询 范围 (页 ) 一 


网 址 >| 因 [所 相遇 |] 1 [| 什 -|10 HH (四 句 
NCE 
关键 字 ~ | | と | | 和 查询 | 倍增 向 | 密度 


选择 搜索 引擎 IM Baidu IV| Google IM YahoolM soso IM] bing IJ SogoulM youdao IM 选择 所 有 


车 终身 免费 的 博客 群发 软件 ， 立 即 下 载 * 次 虫 虫 SE0 软 件 【 博 客 z2009】3. 15 特 价 活动 鞠 有 意 投放 广告 请 联系 g9:68050871 


相关 工具 : 站 长 工具 箱 ” 贸易” 排名 上 不 去 吗 ? 学 SEO 吧 2 问题 反馈 9 查看 更 新 


图 10-3 ”关键 字 查 询 工 具 


(2) 单 击 面板 上 的 “相关 关键 字 查 询 ” 链 接 ， 打 开 “ 相 关 关 键 字 查询 ”对 话 框 ， 在 “ 关 
键 字 ” 文 本 框 中 输入 需要 碍 询 的 关键 字 如 “服装 ”， 单 击 选择 “搜索 引擎 ” 复 选 框 
“Baidu”， 即 表示 在 百度 上 查询 ， 设 置 如 图 10-4 所 示 。 


A Adobe Flash Player 9 周回 四 
文件 中) 查看 上) 控制 已) 希有 


关键 字 排名 查询 工具 四 加 你 怕 什 么 


查询 某 个 网 址 在 某 个 关键 字 搜 索 结果 中 的 排名 
ゆ 使 用 帮助 仿 ver 2011-02-22 


相关 关键 字 坦 询 输入 需要 查询 的 关键 字 ， 每 次 查询 一 个 关键 字 


关键 字 | 服装 | 必須 包含 开始 查询 停止 查询 


搜索 引擎 [VI Baidu | | Google 查询 深度 2 人 ] 级 。 ”关键 字 长 度 小 于 0 を | 0 表示 不 限制 


车 终身 免费 的 博客 群发 软件 ,立即 下 载 4 次 虫 虫 sE0 软 件 【 博 客 2009】3. 15 特 价 活动 车 有 意 投放 广告 请 联系 99:6050671 


欢迎 使 用 相关 关键 字 查 询 功 能 


【相关 关键 字 查询 】 功 能 可 以 快速 查询 一 个 关键 字 在 百度 ,Google 结果 中 的 相关 关键 字 
可 以 设置 查询 深度 、 包 含 关键 字 、 关 键 字 长 度 等 参数 


查询 快速 、 多 种 设置 、 详 细 报 表 


2 = 一 = 一 


相关 工具 : 站 长 工具 箱 村 园 | 相 尝 吕 言 可 的 cndtT5 の 门 三 反馈 (0) 查看 更 新 


10-4 ”关键 子 碍 询 设 首 


(3) 单 击 “ 开 始 碍 询 ” 按 钮 ， 和 等 片刻 即 可 以 得 出 相关 的 关键 季 在 百 度 上 的 收录 情况 ， 
从 收录 数量 即 可 以 判断 应 该 选择 什么 样 的 关键 子 了 。 如 图 10-$ 所 示 。 


> 
PR A 
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A 』dobe Flash Player 9 
文件 W) 查看 (WY) 控 制 C) 帮助 


关键 字 排 名 查询 工具 加 昨 弄 的 啊 ? 
查询 某 个 网 址 在 某 个 关键 字 搜 索 结 果 中 的 排名 
(如 使 用 帮助 @ Ver. 2011-02-22 


相关 关键 字 查 询 输入 需要 查询 的 关键 字 ， 每 次 查询 一 个 关键 字 


关键 字 服装 必须 包含 开始 查询 停止 查询 


搜索 引擎 [VI Baidu 口 Google 查询 深度 2 - 人 | 级 。 ”关键 字 长 度 小 于 0 を | 0 表示 不 限制 


$ ょ 3 + SO 2009】 3.15 に :60506T1 
葛 终身 免费 的 博客 群发 软件 ， 立即 下 载 * 鞠 虫 虫 SE0 软 件 【 博 客 2009】3. 15 特 价 活动 芝 有 意 投放 广告 请 联系 99:6050671 


提示 : 点 击 【 收 录 数 最 】 可 进行 排序 ， 如 结果 为 0 可 能 无 相关 关键 字 或 查询 被 搜索 引擎 屏 车 导出 查询 结果 
と コ 


序号 | 关键 字 

服装 论坛 

儿童 服装 

服装 批发 

服装 设计 
服装 租赁 东方 美 租赁 
服装 搭配 

9 元 韩版 服饰 


索引 擎 深度 收录 数量 

1 14500000 
6240000 
42300000 
51300000 
45900 


中 | 中 | 中 | 中 | 中 | 中 | 中 | 涝 
o.oo.|v. 
= 
こ ご | ご | に | に | に | に | に 


27700000 
2320000 


相关 工具 : 站 长 工具 箱 等 多。 起 学 习 高 超 的 5eo 技 巧 么 ? W み 问题 反馈 @ 查看 更 新 


图 10-$ 查询 结果 


网 站 有 效 优 化 方案 


前 面 已 经 介绍 过 网 站 优化 包含 的 工作 内 容 ， 这 一 小 节 就 详细 介绍 一 下 具体 的 优化 方 守 ， 
主要 包括 网 页 的 外 围 优 化 ， 内 部 细 市 优化 以 及 链接 优化 策略 。 


1 网 页 外 围 优化 


外 围 的 优化 主要 是 指 基于 URL 链接) 的 优化 ，URL 是 统一 资源 定位 ， 即 每 个 网 页 的 
网 址 、 路 径 。 网 站 文件 的 目录 结构 直接 体现 于 URL。 清 晰 简短 的 目录 结构 和 规范 的 命名 有 
利于 用 户 体验 和 网 址 传播 。 

1. 目录 层次 优化 

小 型 网 站 一 般 只 有 一 层 子 目录 如 http://www.hbculture.com/dir/page.htm， 其 中 http://www. 
hbculture.com 是 域名 ，dir 是 一 级 目录 名 ，pasge 是 文件 名 。 对 搜索 引擎 而 言 ， 这 种 单一 的 目 
录 结 构 最 为 理想 ， 即 局 平 结构 《Flat)。 而 规模 大 的 网 站 ， 需 要 2 一 3 层 子 目录 : http://www. 
hbculture.comy/dirdirl/dir2/page.htm。 搜 索引 擎 还 是 会 去 抓 取 2 一 3 层 子 目录 下 的 文件 ， 但 最 
好 不 要 超过 3 层 ， 如 果 超 过 3 层 ， 搜 索引 擎 就 很 难 去 搜索 它 了 。 当 然 如 果 有 以 下 的 情况 ， 即 
使 深入 第 4 层 甚 至 更 深层 的 页 面 ， 也 同样 能 被 搜索 到 : 

(1) 如 条 访 页 提供 了 重要 内 容 ， 有 大 量 来 目 其 他 网 站 的 外 部 链接 〈Inbound Links ); 

(2) 如果 在 首页 上 增加 一 个 该 页 的 链接 ， 可 以 通过 首页 直接 到 达 ; 

(3) 如果 有 其 他 网 站 在 顶级 页 面 上 链接 了 该 页 ， 其 效果 就 好 似 你 在 目 己 的 首页 上 做 了 议 
链接 。 

2. 目录 和 文件 命名 优化 

根据 关键 字 无 所 不 在 的 原则 ， 可 以 在 目录 名 称 和 文件 名 称 中 使 用 到 关键 字 。 但 如 果 是 关 
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键 词组 ， 则 需要 用 分 隅 人 符 分 开 。 和 用 连 字 符 “-” 和 下 划 线 ” ”进行 分 隔 ，URL 中 还 经 津 
出 现 衬 格 码 “%20”。 如 采 以 “ 环 博 制造 ”作文 件 名 ， 可 能 出 现 以 下 三 种 分 隔 形式 : 
made-in-huanbo.htm 

made in huanbo.htm > 

made%20in%20 huanbo.htm 

但 事实 上， 至 少 在 目前 Google 并 不 认同 “ ”为 分 隔 从 。 对 Google 来 说 ， made-in- 
huanbo 和 made%20in%20 huanbo 都 等 于 made in huanbo， 但 made im huanbo 就 被 磁 成 了 
madein huanbo， 连 在 一 起 之 后 ， 天 键 字 下 失 去 了 和 意义。 因此， 目录 和 文件 名 称 如 末 有 关键 词 
组 ， 要 用 连 字 符 “-” 而 不 是 下 划 线 “ ”进行 分 隅 。 

URL 应 该 越 短 越 好 。 有 人 为 了 单纯 增加 关键 字 而 额外 建 多 一 个 市 有 关键 字 的 子 目录 ， 
改变 目录 结构 。 由 于 URL 中 含有 关键 字 本 喘 对 排名 提高 帮助 并 不 大 ， 因 此 这 种 做 法 多 此 一 
举 ， 这 也 是 搜索 引擎 反感 的 。 

3. 绝对 URL 和 相对 URL 

绝对 URL 即 网 员 路 径 使 用 包含 项 级 域名 在 内 的 完整 的 URL。 如 : www.hbculture.com/ 
page/index.html 是 一 个 绝对 路 径 ， 其 中 /age/index.html 则 为 相对 路 径 ， 由 浏览 器 上 自动 在 该 链 
接 前 加 上 http:/www.hbculture.com/。 总 体 上 Google 在 排名 时 并 不 在 意 URL 使 用 的 是 相对 
路 径 还 是 绝对 路 径 。 

目前 很 多 网 站 都 有 数据 库 张 动 生 成 的 URL， 即 动态 URL， 人 往往 表现 为 在 URL 中 出現 
“= 人“% ”以 及 “&”、“$ ”等 学 待 。 动 态 URL 极 不 利于 搜索 引擎 抓 取 网 页 ， 严 重 影 啊 
网 站 排名 ， 通 利 是 通过 拉 术 解决 方案 将 动态 URL 转化 成 静态 的 URL 形式 , 如 : 

将 http://www.hbculture.com/news.php?id=1&type=3 

转化 为 http://www.hbculture.com/news/1/3/ 

导航 结构 优化 

一 个 好 的 网 站 导航 是 对 引导 用 户 访问 网 站 的 栏目 、 球 单 、 在 线 帮 助 、 布 局 结构 等 形式 的 
统称 。 其 主要 功能 在 于 引导 用 户 方便 地 访问 网 站 内 容 ， 是 评 佑 网 站 专业 度 、 可 用 上 度 的 重要 指 
标 。 概 括 地 讲 ， 网 站 在 导航 方面 应 注意 以 下 几 点 。 

(1) 主导 航 导 回 清 晰 : 通 音 主导 舱 为 一 级 目录 ， 通 过 它们 用 户 和 映 蛛 程序 都 可 以 层 层 深 
入 访问 到 网 站 所 有 重要 和 内容。 因此 主导 航 必 须 在 网 站 首页 第 一 屏 的 醒目 位 置 体 现 ， 并 最 好 采 
用 文本 链接 有 的 方式 而 不 是 使 用 图 厂 链 接 。 

(2) 展开 式 导 问 路 径 : 所 谓 “ 展 开 式 导向 ”是 比喻 用 户 通 过 主导 般 到 目标 网 页 的 访问 过 
程 中 的 路 径 提 示 ， 使 用 户 了 解 押 处 网 站 中 的 位 置 而 不 至 于 迷失 “方向 ” 并 方便 回 到 上 级 页 
面 和 起 点 。 路 径 中 的 每 个 栏目 最 好 诬 加 链接 。 

如 下 : 

环 博 文化 : 首页 > 最 新 独 闻 > 最 新 报 道 

即使 没有 详细 的 路 径 来 源 ， 也 至 少 应 该 在 每 个 子 页 面 提 示 回 首页 的 链接 ， 包 括 使 用 页 面 
的 Logo 作 链 接 。 

(3) 重要 内 容 要 突出 : 除了 主导 航 ， 还 应 该 将 次 级 目录 中 的 重要 内 容 以 链接 的 方式 在 首 
页 或 其 他 子 页 中 多 次 呈现 ， 以 突出 重点 。 搜 索引 擎 会 对 这 种 一 站 内 多 次 出 现 的 链接 给 予 充 分 
重视 ， 对 网 页 级 别 〈PageRank) 提高 有 很 大 帮助 ， 这 也 是 每 个 网 站 站 页 的 网 页 级 别 一 般 珊 于 
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其 他 页 面 级 别 的 重要 因 妹 ， 因 为 每 个 子 页 都 对 首页 进行 了 链接 。 

(4) 使 用 网 站 地 图 : 网 站 地 图 是 辅助 导航 的 手段 ， 最 初 是 为 用 户 设 计 的 ， 以 方便 用 户 快 
捷 到 达 目 标 页 。 民 好 的 网 站 地 图 币 间 以 网 站 拓扑 结构 体现 复杂 的 目录 关系 ， 具 有 静态 、 下 
观 、 局 平 、 简 单 的 特点 。 网 站 地 图 多 采用 文本 链接 ， 不 用 或 少 用 修饰 性 图 乒 ， 以 加 快 页 面 加 
载 速度 。 以 上 特 氮 符合 搜索 引擎 优化 的 要 求 ， 因 此 网 站 地 图 在 SEO 中 也 有 重要 的 意义 。 在 
网 站 地 图 中 进行 文本 链接 ， 可 在 一 定 程度 上 弥补 蜂 蛛 程序 无 法 识别 图 片 和 动态 网 页 造成 的 不 
足 。 网 站 地 图 也 要 突出 重点 ， 尽 量 给 出 主干 性 内 容 及 链接 ， 而 不 是 提供 所 有 细 校 末世 。 一 页 
内 不 适宜 放 太 多 链接 。 

5. 图 像 优化 

正 关 情况 下 搜索 引擎 只 识 读 文 本 内 容 ， 对 图 像 是 不 可 见 的 。 同 时 ， 图 像 文件 会 直接 延 组 
页 面 加 载 时 间 ， 如 果 超 过 20s 网 站 还 不 能 加 载 打 开 页 面 ， 用 户 和 搜索 引擎 极 有 可 能 离开 你 的 
网 站 。 因 此 ， 除 非 你 的 网 站 内 容 是 以 岁 片 为 主 ， 比 如 游戏 站 点 或 者 图 片 至 关 重 要 ， 人 否则 尽量 
避免 使 用 大 图 片 ， 更 不 要 采用 纯 图 像 制 作 网 页 。 网 站 图 片 优 化 的 核心 有 两 点 : 增加 搜索 引擎 
可 多 的 文本 描述 ， 以 及 在 保持 图 像 质 量 的 情况 下 尽量 压缩 图 像 的 文件 大 小 。 

Alt 属性 : 

每 个 图 像 <IMG> 标 签 中 都 有 Alt 属性 ， 搜 索引 擎 会 恋 取 该 属性 以 了 解 图 像 的 信息 。 
此 ， 最 好 在 所 有 插图 的 Alt 属性 中 都 插入 文学 描述 ， 并 市 上 该 页 关键 子 在 其 中 。 文 本 说 明 ， 
如 图 10-6 所 示 的 図像 属性 面板 中 “ 替 換 ” 后 面 的 文 本 椎 籍 入 的 文 本 即 訪 Alt 属性 。 
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图 10-6 图 像 属 性 面板 


除了 Alt 属性 文字 ， 还 可 以 考虑 以 下 方法 直接 优化 图 像 ， 使 之 被 搜索 到 : 

(1) 在 图 片上 方 或 下 方 加 上 包含 关键 字 的 描述 文本 ; 

(2) 在 代码 中 增加 一 个 包含 关键 字 的 heading 标题 标签 ， 然 后 在 图 片 下 方 增加 文字 描述 ; 

(3) 在 图 片 下 方 或 旁边 增加 如 “更 多 关键 字 ” 链 接 ， 包 含 关键 词 ; 

(4) 创建 一 些 既 吸引 用 户 又 吸引 搜索 引擎 的 文本 内 页 ， 先 把 流量 吸引 到 这 些 页 面 ， 再 提 
供 文 本 链接 指 癌 你 的 图 片 页 面 ; 

(5) 尽 可 能 把 图 片 处 理 成 GIF 网 页 交互 模式 ， 这 样 能 把 图 片 缩小 。 

总 体 上 ， 网 页 应 尽量 减少 装饰 性 图 片 以 及 大 图 片 。 而 Alt 属性 中 的 文字 对 搜索 引擎 来 
说 ， 其 重要 性 比 正文 内 容 中 的 文字 要 低 。 

6. GIF 和 JPGE 图 像 优 化 

Alt 属性 和 文本 说 明 都 只 是 对 图 像 之 外 的 文本 环 场 进 行 优化 ， 下 耐 简 单 谈 谈 对 图 片 本 号 
的 优化 处 理 。 对 图 片 文件 优化 的 目的 是 在 尽量 不 影响 图 像 画 面 效 果 的 前 提 下 ， 将 其 文件 大 小 
降 到 最 低 ， 以 加 快 页 面 整体 下 载 速 度 。 

网 页 图 厂 格 式 主要 有 GIF 和 JPGE 两 种 形式 。 一 般 来 讲 ，GIF 适用 于 线 图 和 企业 标识 ; 
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JPEG 适宜 照片 元 素 的 格式 。 主 要 通过 减少 GIF 颜色 数量 、 缩 小 图 片 尺寸 和 降低 分 辩 率 来 缩 
小 文件 ， 也 可 以 采用 层 例 样式 表达 到 优化 的 目的 。 些 外， 将 大 图 片 切 割 成 知 干 小 图 片 于 不 同 的 
表格 区 间 内 进行 拼接 ， 也 可 以 相对 加 快 下 载 时 间 。 

7. Flash 优 化 

目前 很 多 企业 网 站 为 了 退 求 页 面 的 美观 ， 通 党 都 使 用 Flash 作为 网 站 的 首页 ， 有 的 甚至 
整 站 都 是 使 用 Flash 开 友 而 成 的 ， 如 图 10-7 所 示 。 
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图 10-7 Flash 网 站 


由 于 搜索 引擎 并 不 重视 Flash 文档 ， 在 对 纯 Flash 页 面 进行 优化 时 ， 我 们 可 以 从 以 下 三 
个 方面 来 独 手 进 行 优 化 工作 : 

(1) 首先 做 一 个 辅助 HTML 版本 : 保留 原 有 Flash 版 本 的 同时 ， 还 可 以 设计 一 个 
HTML 格式 的 版 本 ， 这 样 既 可 以 保持 动态 美观 效果 ， 也 可 以 让 搜索 引擎 通过 HTML 版本 的 
网 页 来 发 现 网 站 。 

(2) 其 次 将 Flash 内 骨 HTML 文件 : 还 可 以 通过 改变 网 页 结构 进行 弥补 ， 即 不 要 将 整 
CR en en 这 样 对 于 用 户 浏 览 3 
不 会 前 弱视 觉 效 果 ， 搜 索引 擎 也 可 以 从 HTML 代码 中 发 现 一 些 必要 的 信息 ， 尤 其 是 进入 内 
ie ee ee ne ed pe ta 
文件 之 外 ， 以 独立 纯 文本 链接 的 方式 呈现 。 

(3) 最 后 进行 付费 登录 搜索 引擎 : 如果 FIash 网 站 搜索 结果 排名 效果 不 太 理 想 ， 可 以 通 

过 付费 登录 或 做 搜索 引擎 关键 字 广 告 ， 同 样 被 用 户 搜索 到 。 

企业 网 站 在 推广 的 时 候 应 尽量 少 用 Flash， 站 点 间 进 行 广告 交换 时 也 要 避免 采用 Flash 
广告 。 

8. 程序 优化 

代码 设置 不 有 不 仅 会 延长 网 页 加 载 时 间 ， 也 将 严重 影响 蜘蛛 程序 对 网 页 内 容 的 抓 取 。 通 

过 对 网 页 代码 进行 清理 ， 去 掉 爱 肿 杂 乱 的 代码 ， 减 小 网 页 文件 大 小 ， 能 够 加 快 网 页 加 载 速 
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度 ， 让 蜂 蛛 快速 索引 到 重要 内 容 。 正 常情 况 下 一 个 页 面 的 文件 大 小 在 15KB 左右 , 最 好 不 要 
超过 50KB。 网 页 优化 重点 涉及 以 下 儿 个 要 点 : 

(1) CSS 样式 优化 。 网 页 制作 应 通过 CSS“〔〈 层 县 样式 表单 ) 来 统一 定制 字体 风格 ， 以 
使 代码 标准 化 ， 避 免 大 量 的 字体 和 格式 化 标签 如 < hl >< /hl >、< font size=12 color=#000000 > 
</fon 人 充斥 页 面 。 通 过 CSS 可 以 控制 任何 HTML 标签 的 风格 。 例 如 <td>,<p>,<body>,<table>， 
<tr>,<th> 等 。 只 要 在 HTML 的 <head> 区 内 的 <style type="text/css"> 和 </style> 之 则 指定 对 应 标 
签 的 风格 如 字体 、 颜 色 、 大 小 即 可 ， 例 如 网 10-8 所 示 的 优化 : 
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10-8 CSS 样式 优化 


<style type="text/css"> 
body,td,th { 
font-size: 12px; 
} 
body { 
margin-top: Opx; 


at 
font-size: 12px; 
color: #000; 
} 
a:link { 
text-decoration: underline; 
} 
a:visited { 
text-decoration: underline: 
color: #999: 


i 第 10 音 TEE 


a:hover { 
text-decoration: none; 
color: #666; 


} 

a:active 1 
text-decoration: underline; 
color: #CCC: 


} 
</style> 


仅 通 过 以 上 设置 ， 就 把 文字 的 字体 、 字 号 、 颜 色 、 背 景色 等 统一 起 来 ， 不 用 对 每 段 文字 
单独 进行 格式 定义 ， 从 而 减少 大 量 重复 性 标签 。 注 意 ， 要 把 所 有 CSS 文件 单独 存放 在 命名 
为 CSS 的 外 部 文件 中 。 通 过 设置 CSS 样式 ， 也 可 以 提升 导航 文本 的 美观 度 ， 达 到 与 图 片 导 
航 同 样 优美 观 的 效果 ， 这 点 尤其 要 提醒 网 页 设计 师 注 意 ， 没 有 必要 将 导航 条 用 图 片 呈现 。 

(2) JavaScript 等 艇 入 脚本 优化 。 正 常情 况 下 ， 网 页 尽量 以 <HTML> 作 为 代码 的 开始 
端 。 但 米 用 JavaScript 技术 的 网 页 往往 在 页 面 一 开始 就 堆积 大 量 Java 代码 ， 以 至 META 
及 关键 字 迟 迟 不 能 出 现 ， 被 推 至 页 面 底 部 ， 对 搜索 引擎 很 不 友好 。 有 两 种 方法 可 以 使 之 得 以 
改善: 

1) 将 脚本 移 至 页 面 底部 。 大 部 分 的 Java 代码 都 可 以 移 到 页 面 结束 标签 之 上 ， 而 不 影响 
网 站 功能 。 这 样 束 能 一 开始 突出 关键 学 ， 并 加 快 页 面 加 载 时 间 。 

2) 将 Java 脚本 置 入 一 个 .js 扩展 名 的 文件 。 如 图 10-9 所 示 实 例 中 首页 航 入 的 JS 文件 。 
图 10-10 所 示 的 是 首页 嵌入 的 代码 。 
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D:\shop\stryle\Article. js 


| 2 Var bstart = 0; 
Ss Var bstop =0; 


5 function fnTogglet) 
6 本 
7 Var next = NowImyg + 1; 


if{lnext == MaxImg+l) 


NowImyg = TaxTmz 
next = 1; 


人 2 诗 Dt Ee { 


m+ 
に つ 


[ry es SE Es 
让 二 二 加 


} 
1f(bStop ! =1) 
{ 


If(bStart == 0) 
{ 


bstart = 1; 3 iad 
setTimeoutt'fnToggle()', 3000); 
return; 

} 


else 


oTransContainer.filters[0] .applYf) : 


円 - 田 


document,. images[ 'oDIV '+next].style.display = ""; 
document. images[ 'oDIV'+NowImg] . style. display = "none"; 
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10-9 分 高 的 JS 文件 
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|——#include file=" confie. asp’ ーー ば 
<|——#include file=" main menu. asD ——» 
“SCR src=" stylerarticle. js > SCRIF 


set rs=serwer. createobject ("adodb. recordset") 
sdl="select top 10 * from 新 闻 表 order by 新 闻 ID DESC" 
ra. open sgl, cornm, 1, 1 


图 10-10 首页 航 入 的 代码 


包含 脱 入 的 JavaScript 代码 的 js 文件 通常 在 网 站 访问 者 的 浏览 器 中 被 缓存 下 来 ， 使 得 下 
次 访问 速度 加 快 ， 也 使 得 网 站 修改 和 维护 起 来 更 加 方便 。 

例 : 

一 段 Java 代 人 码 正和 常情 况 下 显示 如 下 : 


<script language=JavaScript> 

云 | 一 = 

此 处 是 JavaScript 代码 ， 找 贝 到 一 个 .js 文件 
i--> 

</script> 


忽略 开始 及 结束 标签 ， 将 中 间 的 代码 单独 保存 为 扩展 名 为 js 的 文件 ， 如 文件 名 为 
“mycode.js” 的 一 个 文件 ， 然 后 将 此 文件 上 传 到 服务 器 上 与 该 页 同样 的 目录 下 。 最 后 将 上 文 
列举 的 完整 的 JavaScript 置换 为 简单 的 一 行 : <script language=JavaScript src=mycode.js> 
</script> ， 一 个 “mycode.js” 文 件 就 将 大 段 见 长 复杂 的 Java 代码 置换 。 


1 内 部 细 书 优化 ， 

对 搜索 引擎 最 友好 的 网 页 是 静态 网 页 ， 但 大 部 分 内 容 丰 军 或 互动 型 网 站 都 不 可 避 倪 地 和 采 
用 到 相关 技术 语言 来 实现 内 容 管理 和 交互 功能 。SEO 所 强调 的 技术 文 持 ， 主 要 是 对 特定 代码 
的 优化 和 对 动态 网 页 进行 静态 处 理 的 措施 。 

1. Title 和 Meta 标签 优化 

以 .html 或 .htm 为 扩展 名 的 HTML 文档 称 为 静态 网 页 。Meta 称 为 元 标志 ， 用 于 网 页 
的 <head> 与 </head> 中 。Meta 标签 的 用 处 很 多 ， 目 前 儿 乎 所 有 的 搜索 引擎 机 右 人 都 通过 
自 効 食 Meta 值 来 给 网 页 分 类 ， 是 借 此 判断 网 页 内 容 的 基础 。 其 中 最 重要 的 是 Description 
《网 站 摘 述 ) 和 Keywords《〈 网 站 关键 词 )。 另 外 一 个 基本 的 属性 是 Title 标签 ， 提 示 搜 索引 擎 
关于 本 页 的 主题 。Meta 和 Title 的 形式 在 HTML 语言 中 体现 为 : 


<head> 

<title>title 标题 </title> 
<meta name="keywords" > 
<meta name="description" > 


</head> 


& 管 Meta 本 身 不 足以 解决 排名 问题 ， 但 对 Meta 标签 的 书写 仍然 是 搜索 引擎 优化 的 基础 
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工作 。 清 晰 准确 的 Meta 文字 与 正文 内 容 的 关键 词 相 呼应 ， 是 排名 加 分 的 重要 条 件 之 一 。 
标题 ， 
网 页 优化 可 以 说 是 从 Title 开始 的 。 在 搜索 结果 中 ， 每 个 抓 取 内 容 的 第 一 行 显示 的 文字 
就 是 该 页 的 _Title。 同 样 ， 在 浏览 器 中 打开 一 个 页 面 ， 地 址 栏 上 方 显示 的 也 是 该 页 的 (づつ) 
Title。 因 此 ，Title 可 请 一 个 页 面 的 核心 ， 如 图 10-11 所 示 的 标题 动态 程序 就 可 以 随时 在 后 
台 实现 更 改 。 


tt itle> 

<meta http-equivw="Cornt ernt-Tipe" content=" text/html: charset=eb2312"» 
<link href=" style/index. cas” rel=" stylesheet” tvype= text/cas > 
‘script laneuaee= Javascript” tvype= text/Javrascript”» 


图 10-11 标题 优化 后 的 效果 


对 Title 的 书写 要 注意 以 下 问题 : 

(1) Title 应 简短 精练 ， 高 度 概 括 ， 含 有 关键 字 ， 而 不 是 只 有 一 个 公司 名 。 但 关键 字 不 宜 
过 多 ， 不 要 超过 3 个 词组 。 企 业 网 站 的 Title 通 单 以 公司 名 + 关键 字 为 内 容 。 

(2) 前 几 个 词 对 搜索 引擎 最 重要 ， 因 此 关键 字 位 置 义 量 靠 前 。 

(3) 最 好 将 Title 组 织 成 符合 语法 结构 和 阅读 习惯 的 短 句 或 短语 ， 避 免 无 意义 的 词组 罗 
列 式 。 

标题 天 键 字 : 

Keywords 的 作用 在 于 提示 搜索 引擎 : 本 网 站 内 容 围绕 这 些 词汇 展开 。 因 此 Keywords 书 
写 的 关键 是 每 个 词 都 能 在 内 容 中 找到 相应 的 匹配 才 有 利于 排名 。Meta 中 的 关键 学 书写 技巧 
见 前 文 鸭 “关键 字 策 略 ” 

摘 述 (Description): 

描述 部 分 用 简短 的 句子 告诉 搜索 引擎 和 访问 者 基于 本 网 页 的 主要 内 容 。 用 该 网 站 的 核心 
关键 字 搜 索 后 得 到 的 搜索 结果 中 ， 描 述 往往 显示 为 标题 后 的 几 行 描述 文字 。Description 一 般 
被 认为 重要 性 在 Title 和 Keywords 之 后 。 摘 述 的 书写 要 注意 以 下 问题 : 

(1) 描述 中 出 现 关 键 字 ， 确 保 与 正文 内 容 相 关 ; 

(2) 遵 循 筒 短 原川 , 字 符 数 含 空 格 在 内 不要 超 辻 200 个 字符 。 

2. 动态 网 页 优化 

动态 网 站 是 指 网 站 内 容 的 更 新 和 维护 是 通过 一 个 带 有 数据 库 后 台 的 软件 ， 即 内 容 管理 系 
统 (CMS) 完 成 。 一 般 采 用 ASP、PHP、Cold Fusion、CGI 等 程序 动态 生成 页 面 。 动 态 页 面 在 
网 络 空间 中 实际 并 不 存在 ， 它 们 的 大 部 分 内 容 通 利 来 目 与 网 站 相连 的 数据 库 ， 上 只 有 接 到 用 户 
的 请 求 ， 在 变量 区 中 输入 一 个 值 以 后 才 会 生成 。 动 态 网 页 扩展 名 显示 为 .asp、.php、cfm 
或 .cgi， 而 不 是 静态 网 页 的 .html 或 者 .htm。 其 URL 中 通常 出 现 “?”“=”“%”， 以 及 
“及 ”“$” 等 从 写 。 网 站 使 用 动态 技术 的 好 处 ， 除 了 增加 网 站 交互 功能 ， 还 具有 容易 维护 和 
更 新 的 优点 ， 因 此 被 许多 大 中 型 网 站 采用 。 但 大 多 数 搜索 引 敬 的 蜂 蛛 程序 都 无 法 解读 符号 
“?” 后 的 学 从 ， 这 就 意味 看 动态 网 页 很 难 被 搜索 引 敬 检索 到 ， 因 而 被 用 户 找 到 的 机 会 也 大 为 
降低 。 因 此 ， 建 设 网 站 之 前 首先 要 端正 思想 ， 即 能 够 采用 静态 表现 的 网 页 尽量 不 要 用 动态 实 
现 ， 重 要 的 网 页 用 静态 表现 。 同 时 使 用 技术 将 动态 网 页 转化 成 静态 网 页 形式 ， 使 URL 中 不 
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再 包含 “?”“=” 等 类 似 的 符号 。 也 可 以 通过 对 网 站 进行 一 些 改动 ， 间 接 增 加 动态 网 页 的 搜 
索引 擎 可 见 度 。 

针对 不 同 程序 开发 的 动态 网 页 有 看 不 同 的 解决 方案 。 

(1) CGI Perl 技术 : 如 果 网 站 中 使 用 的 是 CGI 或 者 Perl， 可 用 一 个 脚本 拾取 环境 变量 
前 的 所 有 学 符 , 再 閣 URL 中 剩余 的 字符 赋值 给 一 个 变量 。 这 样 ， 束 可 以 在 URL 中 使 用 该 
变量 了 

不 过 ， 对 于 那些 内 置 了 部 分 SSI (Server-Side Include: 服务 器 端 仍 入 ) 内 容 的 网 页 ， 主 
要 的 搜索 引擎 都 能 够 提供 索引 支持 。 那 些 以 .shtml 为 后 级 名 的 网 页 也 被 解析 成 SSI 文件 ， 相 
当 于 通常 的 .html 文件 。 但 如 果 这 些 网 页 在 其 URL 中 使 用 的 是 cgi-bin 路 径 ， 则 仍 有 可 能 不 
伏 搜索 引擎 索引 。 

(2) ASP 技术 : ASP (Active Server Pages: Web 服务 堪 问 动 态 网 页 开发 技术 ) 被 用 于 基 
于 微软 的 网 络 服务 器 中 。 使 用 ASP 开 友 的 网 页 ， 一 役 后 缀 名 为 .asp。 只 要 避免 在 URL 中 
使 用 符 写 “?”， 大 多 数 搜索 引擎 都 能 够 广 持 用 ASP 开发 的 动态 网 页 。 

(3) Cold Fusion 技术 : 使 用 Cold Fusion 就 需要 在 服务 器 端 重新 对 其 进行 配置 ， 使 其 能 
够 将 一 个 环境 变量 中 的 符 写 “?” 用 符号 “/” 代 蔡 ， 并 将 蕉 换 后 的 数值 传 给 URL。 这 样 一 
来 ， 最 后 到 达 浏 览 器 端的 就 是 一 个 静态 的 URL 页 。 当 搜索 引擎 对 该 转换 后 的 文件 进行 检索 
时 ， 它 不 会 下 遇 “?”， 因 而 可 继续 对 整个 动态 页 的 索引 ， 从 而 使 动态 网 页 对 搜索 引擎 仍然 具 
有 可 读 性 。 

(4) Apache 服务 器 : Apache 是 最 流行 的 HITP 服务 器 软件 之 一 。 它 有 一 个 叫做 
mod _ rewrite 的 重 写 模块 ， 即 URL 和 章 写 转 问 功能 。 该 模块 能 够 使 你 将 包含 环境 变量 的 URL 
转换 为 能 够 为 搜索 引擎 文 持 的 URL 类 型 。 对 于 那些 发 布 后 无 顷 多 少 更 新 的 网 页 内 容 如 新 
闻 ， 可 采用 该 重 写 转 加 功能 。 

可 以 通过 对 网 站 做 一 些 修改 ， 尽 可 能 增加 动态 网 页 的 搜索 引擎 可 见 度 。 如 将 动态 网 责编 
入 谢 态 主页 或 网 站 地 图 的 一 个 链接 中 ， 以 毅 态 目录 的 方式 呈现 该 动 页 面 。 或 者 为 动态 页 面 建 
区 一 个 专门 的 毅 态 入 口 页 面 ， 链 接 到 动态 页 面 ， 然 后 将 毅 态 入 口 页 面 递交 给 搜索 引擎 。 

对 一 些 重 要 的 、 内 容 相对 固定 的 页 面 制作 为 于 态 网 页 ， 如 包含 有 丰 蛙 关键 字 的 网 站 介 
绍 、 用 户 帮 助 ， 以 及 含有 重要 页 面 链接 的 网 站 地 图 等 。 网 站 首页 尽量 全 部 采用 静态 形式 ， 并 
将 重要 动态 内 容 以 文本 链接 方式 全 部 呈现 ， 虽 然 增加 了 维护 工作 量 ,， 但 从 SEO 的 角度 看 是 
值得 的 。 
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注重 网 页 级 别 


Google 搜索 引擎 采用 的 核心 软件 称 为 PageRank (PR)， 这 是 一 套用 于 网 页 评级 的 系 
统 ， 是 Google 搜索 排名 算法 中 的 一 个 组 成 部 分 。 评 级 的 级 别 从 1 一 10 级 ，10 级 为 满分 ，PR 
值 越 蜗 说 明 该 网 页 在 搜索 排名 中 的 地 位 越 重 要 ， 也 就 是 说 ， 在 其 他 条 件 相 同 的 情况 下 ，PR 
值 高 的 网 站 在 Google 搜索 结果 的 排名 中 有 优先 权 。 网 页 级 别 由 此 成 为 Google 所 有 网 络 搜索 
工具 的 基础 。 
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10.4.1 网 页 级 别 概述 ) 


一 个 PR 值 为 1 的 网 站 表明 这 个 网 站 不 太 具有 流行 度 ， 而 PR 值 为 7 一 10 则 表明 这 个 网 ( あ ) 


站 非常 受 欢迎 (或 者 说 极其 重要 )。 一 般 PR 值 达 到 4 的 网 站 ， 束 算是 一 个 不 错 的 网 站 了 。 
Google 把 目 己 的 网 站 的 PR 值 定 到 7。 如 图 10-12 所 示 的 是 Google 工具 栏 。 
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图 10-12 Google 工具 栏 上 显示 Google 的 PR 值 为 7 


重要 的 、 局 质量 的 网 页 会 获得 较 高 的 网 页 级 别 。Google 在 排列 其 搜索 结果 时 ， 都 会 考虑 
每 个 网 页 的 级 别 。 当 然 ， 如 采 不 能 满足 得 询 要 求 ， 网 页 级 别 再 高 也 坚 无 意义 。 因 此 ，Google 
将 网 页 级 别 与 完善 的 文本 匹配 技术 结合 在 一 起 ， 为 用 户 找到 最 重要 、 最 有 用 的 网 页 。Google 
所 关注 的 远 不 只 是 关键 字 在 网 页 上 出 现 的 次 数 ， 它 还 对 该 网 页 的 内 容 ( 以 及 该 网 页 所 链接 的 
内 容 ) 进行 全 面 检 查 ， 从 而 确定 该 网 页 是 人 否 满 足 您 的 查询 要 求 。 

PR 值 算法 原理 总 体 上 基于 下 和 面 2 个 前 提 : 

(1) 一 个 网 页 被 多 次 引用 ， 则 它 可 能 是 很 重要 的 ;一 个 网 页 昌 然 没有 被 多 次 引用 ， 但 是 
被 重要 的 网 页 引用 ， 则 它 也 可 能 是 很 重要 的 ; 一 个 网 页 的 重要 性 被 平均 的 传递 到 它 所 引用 的 
网 页 。 这 种 重要 的 网 页 称 为 权威 网 页 。 

(2) 假定 用 户 一 开始 随机 的 访问 网 页 集合 中 的 一 个 网 页 ， 然 后 跟随 网 页 的 链接 回 前 浏览 
网 页 ， 不 回 退 浏览 ， 那 么 浏览 下 一 个 网 页 的 概率 就 是 被 浏览 网 页 的 PageRank 值 。 


“影响 PR 值 因素 ) 


PR 值 体现 为 从 0~10 的 11 个 数值 ， 在 Google 的 工具 栏 上 以 一 条 横向 绿色 柱状 图 显 
示 , 0 级 情况 下 呈 和 白色 ， 它 是 针对 网 页 而 不 是 网 站 。 因 此 一 个 网 站 的 首页 和 内 页 往往 有 着地 
然 不同 的 PR 值 。 对 中 文 网 站 来 说 ， 拥 有 3 级 PR 是 基础 ，4 级 PR 算 达 标 ，5 级 PR 可 谓 民 
好 ， 而 6、7 级 PR 惑 算 相当 优秀 的 网 站 。 当 然 ， 由 于 PR 最 下 接 的 影响 因素 是 来 自 链 接 ， 
此 这 种 评级 并 不 代表 内 容 的 级 别 水 准 ， 网 站 内 容 质量 对 PR 的 影 啊 是 间接 的 、 长 期 的 。 根 据 
PR 值 的 算法 原理 ， 可 知 影响 一 个 网 站 (首页 ) PR 値 的 因 素 主要 包括 : 
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1. 网 站 的 导入 链接 质量 

获得 高 PR 人 需要 获得 来 目 以 下 网 站 的 链接 包括 : 

(1) 加 入 搜索 引擎 分 类 目录 ; 

(2) 与 已 经 加 入 目录 的 网 站 交换 链接 ; 

(3) 获得 来 日 PR 値 不 低 十 4 并 与 网 站 主题 相关 或 互补 的 网 站 的 链接 : 

(4) 网 站 链接 出 现在 流量 大 、 知 名 上 度 遍 、 频 索 更 新 的 重要 网 站 上 ; 

(5) 与 网 站 交换 链接 的 网 站 具有 很 少 导 出 链接 ; 

(6) 与 内 容 质量 高 的 网 站 链接 。 

2. 导出 链接 数量 

根据 PR 计算 原理 ， 由 于 “一 个 网 页 的 重要 性 被 平均 的 传递 到 它 所 引用 的 网 页 ”， 因 此 
有 反 过 来 看 ， 一 个 页 面 内 过 多 的 导出 链接 将 潜在 引起 该 页 PR 値 的 流失 。 但 稚内 容 的 角度 看 , 
适当 数量 的 与 主题 有 关联 的 导出 链接 给 搜索 引擎 市 来 民 好 的 印象 。 因 一 个 页 面 ， 尤 其 是 首页 
的 导出 链接 数量 的 把 握 ， 应 该 兼顾 到 PR 值 和 关键 词 内 容 二 者 之 间 的 平衡 ， 即 控制 导出 链接 
数量 ， 以 不 超过 10 个 为 宜 。 

3. 收录 页 面 数 量 

在 关注 核心 关键 词 排 名 以 及 首页 的 表现 情况 ， 却 往往 忽略 了 一 个 重要 的 问题 : 即 搜索 引 
擎 对 一 个 网 站 收录 的 页 面 数 量 。 后 者 在 SEO 中 也 有 看 极其 重要 的 意义 。 一 个 用 核心 天 键 字 
丛 询 排名 不 佳 的 网 站 ， 可 能 由 于 被 抓 取 大 量 网 页 而 在 用 户 使 用 其 他 关键 字 奏 询 时 ， 内 页 获得 
前 三 甲 排名 。 由 于 用 己 搜 索 时 使 用 的 关键 字 具 有 分 散 性 ， 使 得 这 种 情况 往往 给 网 站 市 来 极 大 
访问 量 。 

正 因 为 收录 页 面 的 数量 直接 影响 访问 量 ， 因 此 对 PR 值 的 影响 也 是 很 大 的 。 被 收录 页 面 
越 多 ， 主 页 PR 越 高 。 不 过 需要 强调 的 是 ， 此 处 所 指 的 数量 是 指 被 收录 数 与 网 站 页 面 总 数 的 
比值 ， 而 不 是 收录 页 面 的 绝对 数值 。 比 如 一 个 拥有 100 个 页 面 的 网 站 被 收录 了 10 个 页 面 ， 
网 站 的 被 收录 比值 是 110， 一 个 拥有 2000 个 页 面 的 网 站 被 收录 了 100 个 页 面 ， 比 值 是 
1/20， 结 果 是 收录 10 个 页 面 比 收录 100 个 页 面 的 网 站 还 更 具 排名 优势 。 

4. 首页 PR 的 高 低 

尽管 对 PR 的 界定 是 针对 网 页 而 不 是 网 站 ， 但 由 于 每 个 网 页 都 依托 茶 一 网 站 而 存在 ， 首 
页 是 推广 的 核心 页 面 ， 所 以 网 站 首页 PR 高 低 对 内 页 各 PR 也 产生 直接 影响 。 一 般 而 言 ， 一 
个 网 站 各 页 面 的 PR 值 呈现 以 下 走 同 : 前 页 > 一 级 足 面 > 二 级 幢 面 > 三 级 页 面 …… 每 深入 一 
级 ，PR 降低 10-2 个 档次 。 如 果 一 个 深层 内 页 有 很 多 外 部 或 内 部 链接 ， 情 况 则 为 当 别 论 。 

5. 文件 类 型 

可 以 索引 到 的 网 页 和 文件 类 型 包括 : pdf、asp、jsp、hdml、shtml、xml、cfm、doc、 
xls、ppt、rtf、wks、lwp、wri、swf。 由 于 做 成 PDF 格 陈 的 文件 往往 都 是 网 站 比较 重要 的 内 
容 或 文章 ， 因 此 Google 默认 PDF 格式 文件 的 PR 天 生 为 3, 高 二 一 般 HTML 文件 。 同 
理 , Google 给 予 XML、PS、Word、Power Point、Excel 等 类 型 页 面 的 PR 也 比 普 通 网 页 
文件 高 。 因 此 ， 对 于 网 站 比较 有 价值 的 内 容 建 议 做 成 PDF 格式 。 

6. PR 值 的 更 新 

Google 每 个 月 进行 一 次 数据 更 新 ， 更 新 后 的 网 站 排名 和 导入 链接 都 会 有 茶 些 变化 ， 但 
其 PR 更 新 时 间 一 般 要 延迟 全 更 新 后 的 三 个 月 左右 ， 而 且 网 站 的 PR 值 相对 稳定 ， 要 上 升 或 
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下 降 一 级 PR 是 很 不 容易 的 事情 。 


证 PR 值 的 作用 


由 于 网 页 级 别 的 融 低 直接 受 链接 的 影响 ， 而 链接 仅 是 SEO 的 一 个 方面 ， 因 此 PR 的 高 > 
低 只 能 反映 出 SEO 的 部 分 效 采 。 一 个 网 页 如 来 拥有 局 PR 值 能 够 说 明 的 仅 是 网 页 比较 重要 ， 
拥有 了 排名 菲 前 的 优先 权 ， 并 不 能 与 排名 匪 前 直接 画 上 等 写 ， 搜 索引 擎 会 加 快 对 网 页 数据 的 
更 新 。 
PR 值 不 高 的 网 站 同样 有 可 能 获得 好 的 排名 ， 而 PR 高 的 网 站 也 不 见得 有 理想 的 排名 。 并 
且 ， 在 这 样 的 思想 指导 下 ， 往 往 万 面 退 求 链接 效应 ， 忽 略 了 SEO 对 于 内 容 、 结 构 、 关 键 字 
等 方面 的 分 机 和 改进 ， 而 后 者 才 是 用 户 和 搜索 引擎 长 期 关注 的 焦点 。 在 SEO 的 过 程 中 ， 不 
能 起 记 内 容 建 设 ， 不 能 息 记 优质 外 链 ， 但 也 要 适当 注音 网 页 的 PR 值 。 


Android 人 入门 与 实战 体验 
书号 : 34928 定价 : 69.80 元 
作者 : 李 佐 棚 等 
本 书 通过 实例 教学 的 方式 讲解 了 Android 


技术 在 各 个 领域 的 具体 应 用 过 程 。 全 书 分 为 16 | 
章 ，1 一 5 章 是 基础 篇 ， 讲 解 了 Android 的 发 展 前 上 E 
景 和 开发 环境 的 搭建 过 程 ; 6 一 13 章 是 核心 技术 | 
篇 ， 详 细 讲 解 了 Android 技 术 的 核心 知识 ， 并 对 | 


程序 优化 进行 了 详细 剖析 ; 14 一 16 章 是 综合 实 
战 应 用 篇 ， 通 过 3 个 综合 实例 讲解 了 Android 技 
木 常用 的 井 色 流 程 。 


追逐 App Store 的 脚步 一 一 
手机 软件 开发 者 创 富 之 路 


书号 : 35619 定价: 49.00 元 
作者 : 项 有 建 


本 书 介绍 了 如 何 进行 软件 产品 设计 , 特别 | 
是 如 何 针对 现代 手机 软件 产品 进行 设计 ;介绍 上 
了 数字 产品 的 营销 方法 ， 特 别 是 如 何 针对 现代 | 
手机 软件 产品 进行 营销 的 方法 。 书 中 强调 了 用 
户 需求 以 及 竞争 两 个 设计 视角 , 介绍 了 “平台 辐 
射 原理 ”, 初步 解决 了 如 何 利用 公式 化 的 方法 用 
平台 推广 产品 的 问题 。 


Android 开发 案例 驱动 教程 


书号 : 35004 定价: 69.80 元 
作者 : 关东 升 
本 书 旨 在 帮助 读者 全 面 掌 握 Android 开 发 


技术 ， 能 够 实际 开发 Android 项 目 。 本 书 全 面 介 上 


绍 了 在 开源 的 手机 平台 Android 操 作 系 统 下 的 


应 用 程序 开发 技术 ， 包 括 UI、 多 线程 、 数 据 存 


储 、 多 媒体 、 云 端 应 用 以 及 通信 应 用 等 方面 。 


本 书 采用 案例 驱动 模式 展开 讲解 ， 既 可 作为 高 | 
等 学 校 的 参考 教材 , 也 适合 广大 Android 初 学 者 | 


和 Android 应 用 开发 的 程序 员 参 考 。 


Windows Phone 7 完美 开发 征程 
书号 : 34043 ”定价 : 43.00 元 
作者 : 倪 洗 

本 书 以 全 新 的 Windows Phone 7 手机 应 用 

程序 开发 为 主题 ， 采 用 理论 和 实践 相 结合 的 方 | 
法 ， 由 浅 入 深 地 讲述 了 新 平台 的 基础 架构 、 开 | 
发 环境 、 图 形 图 像 处 理 、 数 据 访问 、 网 络 通信 上 [ 
等 知识 点 。 最 后 通过 较为 完整 的 实战 演练 ， 帮 | 
助 读者 更 快 地 掌握 项 目 开发 的 各 个 技术 要 点 ， | 
使 读者 能 够 尽快 投入 到 实际 项 目的 开发 。 


从 实例 走 进 OPhone 世 界 


书号 : 33030 定价; 45.00 元 
作者 : 周 轩 

本 书 从 一 个 开发 者 的 角度 出 发 ， 介 绍 了 
OPhone/Android 系 统 的 基础 知识 和 开发 技巧 ， 
详细 讲解 了 无 线 通信 、 娱 乐 游戏 、 移 动 生 活 、 
OPhone 特 色 应 用 等 多 种 类 型 程序 的 开发 流程 | 
和 方法 ， 通 过 介绍 系统 自 带 源 代码 实例 ， 为 读 | 
者 提供 参考 资料 和 分 析 素 材 。 本 书 配 有 大 量 插 | 
图 和 代码 注释 ， 为 自学 者 提供 了 方便 。 | 


Qt 开发 Symbian 应 用 权威 指南 
书号 : 36089 ”定价 : 45.00 元 
作者 : Fitzek 等 译 者 : DevDiv 移动 开发 社区 | 
本 书 主要 是 向 读者 介绍 如 何在 Symbian 上 | 
快速 有 效 地 创建 Qt 应 用 程序 。 全书 共 分 7 章 , 包 | 
括 开发 入 门 、Qt 概 述 、Qt Mobility APIs、 类 Qt | 
移动 扩展 、 Qt 应 用 程序 和 Symbian 本 地 扩展 、 | 
Qt for Symbian 范例 。 | 
本 书 可 作为 移动 设备 开发 领域 的 初学 者 和 | 
专业 人 员 的 参考 用 书 ， 也 可 作为 手机 开发 基础 | 
课程 的 教材 。 | 


本 书 通 用 于 iPad 2/iPad 1 


上 ) 中 ; 方式 
动 存 铺 : 登 ipad 2 当 U 盘 使 用 
休闲 阅读 : 从 移 上 下 载 免费 电子 书 
“办 公 应 用 : 利用 iTunes 下 载 象 帝 软件 
”在 线 开 店 : 在 App Store 开 设 租 己 的 高 让 
购物 梦 翅 ; 在 iTunes 和 App Store 上 持 接 信用 


| 机 械 工业 出 版 社 


CHINA MACHINE PRESS 


苹果 的 味道 一 一 iPad 商务 应 用 每 一 天 
喜 烨 ”编著 


商务 办 公 ， 原 来 如 此 轻松 

7 : 00~9 : 00 一 一 将 碎片 化 为 财富 

9: 00~10 : 00 一 一 从 井井有条 开始 

10 : 00~11 :00 一 一 网 络 化 商务 沟通 
11 : 00-12 : 00 一 一 商务 参考 好 帮手 
13 : 00~14 :00 一 一 商务 文档 的 制作 
14 : 00~15 : 00 一 一 商务 会 议 中 的 iPad 
15 : 00~ 16 : 00 一 一 打造 商务 备 忘 

16 : 00~17 : 00 一 一 云端 商务 


ISBN 978-7-111-36530-3 
定价 ; 59.80 元 


哨 笠 果 一 一 就 是 要 玩 iPad 
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定价 32.80 元 
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ISBN 978-7-111-37947-8 
定价 ; 69.80 元 ( 含 1CD) 
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DH Dey OL+ Dreamweaver 
动态 网 站 建设 从 入门 到 精通 ; 


地 址 :北京 市 百 万 庄 大 街 22 号 
邮政 编码 :100037 

电话 服务 

社 服务 中 心 : 010-88361066 
销售 一 部 : 010-68326294 

销售 二 部 : 010-88379649 

读者 购书 热线 : 010-88379203 


isi 上 水 拒 导 计算 机 7 网 站 设计 
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封面 无 防伪 标 均 为 冯 版 。 责任 编辑 ， 丁 诚 / 封面 设计 : 
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